Vue.js最簡單的代碼
阿新 • • 發佈：2018-12-06
oca onload ref 點擊 rip 數據 date func load <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue.js的入門</title>
<!-- 導入 -->
<script type="text/javascript" src="../jss/vue.js"></script>
<script type="text/javascript">
<!-- 單一入口 -->
window.onload = function(){ var app = new Vue({
// el屬性用來綁定元素節點
el:"#app",
// data屬性用來綁定數據
data:{
message:"Hello World"
}
}); // 建立vue對象
var app2 = new Vue({ el:"#app2", data:{ message:"頁面加載中"+new Date().toLocaleString+"今天心情真好!"
}
}); }
</script>
</head>
<body>
<div id="app">
<!-- vue的模板語法，用來輸出變量 -->
{{message}}
</div> <div id="app2">
<!-- 把title屬性和messa變量聯系起來 -->
<span v-bind:title="message">
請讓鼠標懸停幾秒鐘，來觀看這個頁面刷新的時間
</span>
</div> <!-- 將tilte寫“死” -->
<a href="#" title="這是一個空鏈接">點擊我</a> </body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue.js的入門</title>
<!-- 導入 -->
<script type="text/javascript" src="../jss/vue.js"></script>
<script type="text/javascript">
<!-- 單一入口 -->
window.onload = function(){ var app = new Vue({
// el屬性用來綁定元素節點
el:"#app",
// data屬性用來綁定數據
data:{
message:"Hello World"
}
}); // 建立vue對象
var app2 = new Vue({ el:"#app2", data:{ message:"頁面加載中"+new Date().toLocaleString+"今天心情真好!"
}
}); }
</script>
</head>
<body>
<div id="app">
<!-- vue的模板語法，用來輸出變量 -->
{{message}}
</div> <div id="app2">
<!-- 把title屬性和messa變量聯系起來 -->
<span v-bind:title="message">
請讓鼠標懸停幾秒鐘，來觀看這個頁面刷新的時間
</span>
</div> <!-- 將tilte寫“死” -->
<a href="#" title="這是一個空鏈接">點擊我</a> </body>
</html>
Vue.js最簡單的代碼