Vue.js 的核心是一個允許采用簡潔的模板語法來聲明式的將數據渲染進 DOM,也就是將模板中的文本數據寫進DOM中,使用 {{data}} 的格式寫入。此代碼都是Vue.js官網上的實例。
1、首先導入Vue.js
<script type="text/javascript" src="vue.js"></script>
2、html和js代碼
<body> <div id="id"> //id為實例中el的屬性 {{message}} </div></body><script> var vm = new Vue({ el:"#id", data:{ message:'渲染到html中的數據!' } })</script>3、渲染結構:

下面看看將文本數據單向綁定到DOM元素屬性上,將這個元素節點的title 屬性和 Vue 實例的 message 屬性保持一致,代碼如下
<body> <div id="id"> <span v-bind:title="message"> <!--綁定實例中的數據--> <!-- <span :title="message"> 簡寫--> 鼠標懸停幾秒鐘查看此處動態綁定的提示信息! </span> </div></body><script> var vm = new Vue({ el:"#id", data:{ message:'頁面加載的時間'+new Date() } })</script>渲染結構:

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答