初识vue.js

Posted 2020-10-27 小欣子

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了初识vue.js相关的知识，希望对你有一定的参考价值。

　　1.引入vue.js

<script type="text/javascript" src="js/vue.js" ></script>

　　2.js获取vue

var box=new Vue({
    el:\'.box\',              //获取元素  
    data:{                 //所有的数据写在这里
        msg:\'hello\'   　　　　/*定义并初始化msg值*/
    }
})

　　3.html标签中输出msg值

<div class="box">
    <input v-model="msg"/>   <!--绑定msg值,当用户改变inp中的值,下面p标签中的值也会跟着改变,双向绑定-->

<p>{{msg}}</p> </div> <!--获取msg值-->

　　4.页面显示

以上是关于初识vue.js的主要内容，如果未能解决你的问题，请参考以下文章