事件
案例：
vue的事件绑定原理:改变图片的背景颜色问题来实现这个框架的使用方法，
new Vue({
el:"",
data:{},
methord:{},
computed:{} 计算属性的使用：用于大量基于数据模型的计算，但并不是每一次渲染都发生更改，计算属性就会将数据直接返回，这样提高计算效率。
mounthd:{}
})
我们在事件绑定的时候传入参数：比如点击事件，@click=“funname($event,index)”
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="text" name="" id="input" value="" />
<h1></h1>
<h3 id="username"></h3>
<h4 id="age"></h4>
<script type="text/javascript">
var inputText = document.querySelector(‘#input‘)
var h1 = document.querySelector(‘h1‘)
var h3 = document.querySelector(‘#username‘)
var age = document.querySelector(‘#age‘)
inputText.oninput = function(){
var value = inputText.value
h1.innerHTML = value;
}
var obj = {
// name:‘张三‘,
age:14,
set name(value){
// console.log(value)
this._name = value
h3.innerHTML = this._name
},
get name(){
return this._name
},
}
console.log(obj)
//setter,getter//es6,es2015标准
//在给对象属性赋值，或者是获取对象属性的时候，会调用setter、getter两个方法
</script>
</body>
</html>
数据双向绑定
原文地址：https://www.cnblogs.com/wuzaipei/p/9496504.html
时间： 2024-11-25 12:27:43