标签：el Vue methods msg3 msg2 bind cloak text msg

<div id="dv">
　　<!-- v-cloak能够解决表达式闪烁问题
　　（当网速较慢时，会先出现{{msg}}，当请求完毕后才会将数据替换） -->
　　<p v-cloak>===={{msg}}====</p>
　　<p>========={{msg2}}========</p>
　　<h4 v-text="msg">============</h4>
　　<!--默认 v-text 没有闪烁问题-->
　　<!-- v-text会覆盖元素中原本内容，
　　而插件表达式不会覆盖，可在前后增加想要的元素 -->
　　<div v-text="msg3"></div>
　　<div>{{msg3}}</div>
　　<div v-html="msg3"></div>
　　<!-- v-html能够将数据当成HTML文本显示，会覆盖原有内容 -->
　　<!-- v-text与插件表达式只会讲数据当成普通文本显示 -->

　　<!-- v-bind：用于绑定属性的指令 -->
　　<input type="text" v-bind:value="mytitle">
　　<!-- v-bind可以简写成 : -->
　　<!-- v-bind原理是将被绑定的属性的值当成js代码执行，
　　所以可以在其中写合法的表达式-->
　　<input type="text" :value="mytitle+'123'" @click = "show">

　　<!-- v-on：事件绑定机制 -->
　　<!-- v-on：缩写@ -->
　　<input type="button" value="按钮" v-on:click = "show">
</div>

<script>
　　var vm = new Vue({
　　　　el: '#dv',//el：代表被操作的元素
　　　　data:{//存储数据,这里面的数据名不是固定的
　　　　　　msg:'123',
　　　　　　msg2:'456',
　　　　　　msg3:'<h1>哈哈，你好Vue</h1>',
　　　　　　mytitle:'这是我自己定义的title'
　　　　},
　　　　methods:{//这个methods属性定义了当前Vue实例中所有可用的方法
　　　　　　show:function () {
　　　　　　　　alert("hello");
　　　　　　}
　　　　}
　　});
</script>

标签：el,Vue,methods,msg3,msg2,bind,cloak,text,msg
来源： https://www.cnblogs.com/Smile-W/p/11002282.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。