首页 > 其他 > 详细

vue中的属性绑定和双向数据绑定

时间:2018-08-19 13:50:45      阅读:239      评论:0      收藏:0      [点我收藏+]
<html lang="en">
<head>
<meta charset="UTF-8">
<title>属性绑定和双向数据绑定</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="root">
<div title="this is hello world">hello world</div>//title作用是当鼠标放在hello world 上面的时候,显示this is hello world
</div>
 

<script>
new Vue({
el:"#root",
 
})
</script>
</body>
</html>
提示语可变的情况:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>属性绑定和双向数据绑定</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="root">
<div v-bind:title="title">hello world</div>//使用模板指令,等号后面跟的是一个JS表达式 v-bind:可以缩写成:
</div>
 

<script>
new Vue({
el:"#root",
data:{
title:"this is hello world"//此时数据项的title 和上面的属性做好了数据绑定
}
})
</script>
</body>
</html>
 

vue中的属性绑定和双向数据绑定

原文:https://www.cnblogs.com/Regina-o/p/9501019.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!