<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 创建新的页面,记得引入。 -->
<script type='text/javascript' src="../JS/vue.js"></script>
</head>
<body>
<div id="root">
<h1>Hellow,{{name}}</h1>
</div>
<script>
Vue.config.productionTip = false;
// const v = new Vue({
// // el的第一种写法
// // el: '#root',
// data: {
// name: 'vue学习'
// }
// })
// el的第二种写法
// v.$mount('#root')
// 第二种更灵活,例如:想1s之后在发生变化。
setTimeout(() => {
v.$mount('#root')
}, 1000);
// const v = new Vue({
// el: '#root',
// // data的第一种写法
// data: {
// name: 'vue学习'
// }
// })
// data的第一种写法
const v = new Vue({
el: '#root',
// data的第一种写法
// 注意:只能写普通函数,此时的this指向的是Vue,箭头函数指向的是window
// data: function () { // 还能简写成如下。
data() {
return {
name: 'vue学习'
}
}
})
</script>
</body>
</html>
04.el和data的写法
最新推荐文章于 2024-07-25 15:19:10 发布