标签：尺寸 oca cti nbsp rip this for 优化 -o
<html>
<head>
<title>vue</title>
<!-- 生产环境版本，优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<div id="app">
<div>name={{name}}</div>
<div v-bind:title=‘message‘>鼠标悬停查看信息</div>
<div v-if=‘seen‘>v-if使用</div>
<div>
v-for使用
<ul>
<li v-for=‘(value, index) in items‘ v-on:click=‘choose(index)‘>{{index}}-{{value}}</li>
</ul>
</div>
<div v-on:click=‘click‘>点击</div>
<div>
v-model
<div>{{model}}</div>
<input v-model=‘model‘/>
</div>
</div>
<script type="text/javascript">
// 开启开发调试
Vue.config.devtools = true
// 数据
var data = {
name: ‘lay‘,
message: ‘页面加载于‘ + new Date().toLocaleString(),
seen: true,
items: [1,2,3,4,5],
model: ‘model-content‘
}
var methods = {
click: function(){
alert(‘clicked‘)
},
choose: function(index){
console.log(this.items[index])
}
}
// 初始化模块
var vm = new Vue({
el: ‘#app‘,
data: data,
methods: methods
})
</script>
</body>
</html>
标签：尺寸 oca cti nbsp rip this for 优化 -o
原文地址：https://www.cnblogs.com/lay2017/p/8821504.html
