第二步，在body标签元素内插入div和select，注意给指定标签元素id属性值，如下图所示：
第三步，在div下方编写生成下拉框的数据源和绑定元素，下拉框有value和text，如下图所示：
第四步，预览该静态页面，发现下拉框什么都没有；打开浏览器控制台发现出现错误，如下图所示：
第五步，修改option标签数据绑定形式，利用v-bind，将js代码中的sel改为data，如下图所示：
6
第六步，再次预览该静态页面，发现下拉框数据源正确绑定，可以选择，如下图所示：
html>
<head>
<title>Hover</title>
<style type="text/css">
*{
padding: 0
margin: 0
font-size: 11pt
}
div{
float: left
width: 100px
margin-right: 20px
padding: 5px
border: 1px solid #999
background-color: #eee）
Vue.js介绍：
Vue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。
如果你之前已经习惯了用jQuery *** 作DOM，学习Vue.js时请先抛开手动 *** 作DOM的思维，因为Vue.js是数据驱动的，你无需手动 *** 作DOM。它通过一些特殊的HTML语法，将DOM和数据绑定起来。一旦你创建了绑定，DOM将和数据保持同步，每当变更了数据，DOM也会相应地更新。
当然了，在使用Vue.js时，你也可以结合其他库一起使用，比如jQuery。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）