CODEWITHSUNDEEP
vuejs3
Валерий Климов
Валерий Климов

Reputation: 1

Editing information in the onMounted lifecycle stage of a component in the Vue 3 Composition API

I am studying VUE 3. At the mount stage, after receiving data from the server, I decided to change the data:

cript setup>
...
const Task = ref([])
...
onMounted(() => {
    idTask.value = props.id
    axios
        .get("/tasks/" + idTask.value)
        .then(res => {
            Task.value = res.data
        })
    if (Task.value['description'] === '')
        Task.value['description'] = 'Enter task description text'
..

However, it turned out that Task.value['description'] is undefined at this stage

Used the onBeforeUpdate lifecycle hook for validation. There is access to the variable. The value is displayed. Surely you can change it.

onBeforeUpdate (() => {
    console.log(Task.value['description'])
    }

Question: At a mount stage it is not supposed to change the data? Or I did not find how to do it?

Upvotes: 0

Views: 42

Answers (1)

efecdml
efecdml

Reputation: 36

I use onMounted lifecycle hook only for accessing to DOM elements. And on it's documentation says:

This hook is typically used for performing side effects that need access to the component's rendered DOM, or for limiting DOM-related code to the client in a server-rendered application.

Upvotes: 0

Related Questions