Noções básicas do VUE (4): realizar ligação bidirecional

1. Como o Vue consegue vinculação bidirecional?
Use Object.defineProperty para sequestrar o acessador do objeto. Quando o valor da propriedade muda, podemos obter a mudança e, em seguida, dar respostas subsequentes com base na mudança (operações semelhantes são realizadas por meio do objeto proxy em vue3.0).

// 这是将要被劫持的对象 
const data = {
    
     name: '', };

function say(name) {
    
     
	if (name === ' 古 天 乐 ') {
    
     console.log('给⼤家推荐⼀款超好玩的游戏 '); } 
	else if (name === '渣渣辉') {
    
     console.log('戏我演过很多,可游戏我只玩贪玩懒⽉'); } 
	else {
    
     console.log('来做我的兄弟'); } }

// 遍历对象,对其属性值进⾏劫持
 Object.keys(data).forEach(function(key) {
    
     
 	Object.defineProperty(data, key, {
    
     
 		enumerable: true, 
 		configurable: true, 
 		get: function() {
    
     console.log('get'); },
 		set: function(newVal) {
    
     
 		// 当属性值发⽣变化时我们可以进⾏额外操作 
 		console.log(` ⼤ 家 好 , 我 系 ${
      
      newVal}`); 
 		say(newVal); },
 	}); 
 }); 
 data.name = '渣渣辉'; 
 //⼤家好,我系渣渣辉 
 //戏我演过很多,可游戏我只玩贪玩懒⽉

Acho que você gosta

Origin blog.csdn.net/imagine_tion/article/details/110683536
Recomendado
Clasificación