Vue.js是什么
Vue.js是一套构建用户界面的渐进式框架，Vue 采用自下向上增量开发的设计，其核心库只关注视图层，易于上手，同时vue完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。
常用命令
1.v-cloak 可以解决插值表达式闪烁问题
2.v-text 默认v-text没有闪烁问题 ,v-text会替换元素中原本的内容
3.v-html 插值表达式一样会替换原本的内容但是会将内容转换成html格式
- v-bind: 是Vue中,提供用于绑定属性的指令
5.v-on: v-on:是Vue中事件绑定机制
<body>
<div class="app">
<p v-cloak>+++++{{msg}}++++++</p>
<h2 v-text="msg">+++++++</h2>
<!-- 默认v-text没有闪烁问题 ,v-text会替换元素中原本的内容,但插值表达式只会替换自己的占位符-->
<div>{{msg2}}</div>
<div v-text="msg2"></div>
<!-- 插值表达式和v-text都不能转换html格式 -->
<div v-html="msg2">1111</div>
<!-- v-html和插值表达式一样会替换原本的内容但是会将内容转换成html格式 -->
<input type="button" value="按钮" v-bind:title="mytitle">
<input type="button" value="按钮" :title="mytitle + '1234'">
<!-- v-bind:是Vue中,提供用于绑定属性的指令,v-bind:时mytitle被当成一个表达式,表达式中可以添加内容 ,v-binde:可以简写为:-->
<input type="button" value="按钮" v-on:click="show">
<input type="button" value="按钮" @click="show">
<!-- Vue中提供了 v-on:事件绑定机制 ,v-on:可以缩写为@-->
</div>
<script>
var vm = new Vue({
el: '.app',
data: {
msg: '1234',
msg2: '<h1>这是一个h1</h1>',
mytitle: '这是一个自定义title变量'
},
methods: { //这个methods属性中定义了当前Vue实例所有可用的方法
show: function() {
alert('hello')
}
}
})
</script>
</body>
