Rumah > Artikel > hujung hadapan web > Apakah sifat jam tangan dalam vue
jam tangan ialah atribut pemantauan. Dalam Vue, anda boleh memantau perubahan atribut tertentu melalui atribut jam tangan Apabila atribut ini berubah, anda boleh melakukan beberapa operasi: 1. Apabila atribut yang dipantau oleh atribut yang dipantau berubah, fungsi panggil balik akan dipanggil secara automatik dan Perform. operasi berkaitan; 2. Atribut pemantauan Atribut yang dipantau mesti wujud supaya berkesan. Terdapat dua cara untuk menulis sifat pemantauan: "Vue baharu({watch:{}})" dan "objek instantiated vue.$watch(fungsi panggil balik 'property name')".
Persekitaran pengendalian tutorial ini: sistem windows7, versi vue3, komputer DELL G3.
Semasa pembangunan, kita akan menghadapi situasi di mana kita perlu melakukan beberapa operasi apabila hartanah berubah. Sifat yang mengesan perubahan ini dipanggil sifat pemantauan dalam Vue.
1. Apakah atribut pemantauan itu? atribut ini Apabila perubahan berlaku, terdapat beberapa perkara yang boleh kita lakukan.
Apabila atribut yang dipantau oleh atribut pemantauan berubah, fungsi panggil balik (pengendali) akan dipanggil secara automatik dan operasi yang berkaitan akan dilakukan Atribut yang dipantau oleh atribut pemantauan mesti wujud , adakah ia mempunyai kesan.<div id="app"> <p>今天天气很{{info}}</p> <button v-on:click="change">切换天气</button> </div>Fungsi
dalam kod ialah fungsi panggil balik yang kami nyatakan sebelum ini Apabila atribut
berubah, fungsi ini akan dipanggil secara automatik.var vm = new Vue({ el: "#app", data: { isHot: true, }, computed: { info: function () { return this.isHot ? "热" : "冷"; } }, methods: { change: function () { this.isHot = !this.isHot; } }, watch: { isHot: { handler:function (newVal, oldVal) { console.log("isHot属性发生了变化"); }, } } });
Sudah tentu kita boleh menambah atribut pada objek handler
: isHot
Apabila nilai Boolean atribut ini adalah benar, fungsi panggil balik
idHot
immediate
handler
watch: { isHot: { handler:function (newVal, oldVal) { console.log("isHot属性发生了变化"); }, immediate: true } }
Terdapat dua cara untuk menulis atribut pemantauan: <.> dalam Tulis terus dalam objek instantiasi vue:
, dan kemudian masukkan konfigurasi yang berkaitan
new Vue({watch:{}})
melalui vue实例化对象.$watch('属性名',回调函数)
Di sini kita menganggap bahawa objek instantiasi vue ialah vm. 3. Pemantauan mendalam terhadap atribut pemantauan
vm.$watch('isHot',function (newVal, oldVal) { console.log("isHot属性发生了变化"); });
Pemantauan yang kami laksanakan sebelum ini hanya boleh memantau data mudah dan langsung bagi instance vue. Data tidak boleh dipantau jika ia menemui objek atau tatasusunan. Cara untuk melakukan ini ialah untuk meningkatkan kecekapan, dalam sifat pemantauan Vue, hanya satu lapisan dipantau secara lalai. Jika kita ingin memantau berbilang lapisan, kita perlu mendayakan pemantauan mendalam secara manual .
Antaranya
membolehkan pemantauan yang mendalam. Pemantauan mendalam adalah untuk memantau objek atau tatasusunan dalam data dalam Vue Apabila sifat dalam objek atau tatasusunan berubah, fungsi panggil balik sifat pemantauan akan dipanggil secara automatik. Dalam vue, sebenarnya adalah mungkin untuk mengesan perubahan dalam nilai dalaman objek, jadi mengapa sifat pemantauan vue tidak mendayakan pemantauan mendalam secara lalai?watch: { isHot: { handler:function (newVal, oldVal) { console.log("isHot属性发生了变化"); }, immediate: true, deep: true } }
Oleh kerana fungsi panggil balik sifat pemantauan Vue dipanggil apabila data berubah Jika pemantauan mendalam dihidupkan, Vue akan memantau semua sifat di dalam objek, yang akan mengurangkan kecekapan Vue. deep:true
tutorial video vuejs
,pembangunan bahagian hadapan web
]Atas ialah kandungan terperinci Apakah sifat jam tangan dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!