Arrays in vue watch listening objects

data(){
    return {
        form: {
            arr: [0, 1, 2]
        }
    }
}

this.form.arr[3] = 3;

how do I listen for changes in elements in arr?

I tried to use deep: true did not work

add: 

<el-form-item label="" prop="citys">
    <el-cascader
            placeholder=""
            style="width: 100%"
            :props="{
            label: "name",
            value: "id",
        }"
            :options="cityList"
            v-model="form.citys"
    ></el-cascader>
</el-form-item>
Vue.js
May.27,2021

Vue contains a set of ways to observe the variation of an array, and modifying array elements directly through the index cannot listen for array changes.

ide/list.html-sharp%E5%8F%98%E5%BC%82%E6%96%B9%E6%B3%95" rel=" nofollow noreferrer "> https://cn.vuejs.org/v2/guide.

this.from.arr.push(3)
When the

form.citys changes, do not his.form.citys = {xxx}, use the this.$set method to let vue re-establish listening on the array, so that the v-model continues to be valid.

for example, if you want to assign the return value res.data obtained by ajax to form.citys:
this.form.citys = this.$set ({}, res.data);

take a look at the principle of vue data response. Vue is hijacked by data, and arrays cannot do this.

if you only access the data elements through the array, you can copy the array
Baidu js

this.form.arr.splice (3,1,3)

.

Previous: Kubeadm init failed all the time in pull image?

Next: Using Java to manipulate mongoDB how to manipulate document embedded collection paging using the aggregate function Aggregate,?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu