引入VUE:
产生一个全局的Vue“构造函数”,调用时用“new”创建实例:new Vue()
<head>
<!-- 引入Vue -->
<scrip type="text/javascript" src="../Vue_js/vue.js"></scrip>
</head>
创建容器:
“root”容器里的代码被称为“Vue模板”
<body>
<!-- 准备一个容器 -->
<div id="root">
</div>
<body>
创建Vue实例:
“const x = new Vue()”由function Vue() {} 实例化出的Vue对象“this”为“x”Object对象,“this”属于Vue构造函数“this instanceof Vue ➡ true”
</body>
<script type="text/javascript">
Vue.config.productionTip = false // 阻止提示
// 创建Vue实例
const x = new Vue()
</script>
</body>
为Vue的实例传参,参数为一个对象{}:
const x = new Vue({
el:'#root', // e1用于指定当前Vue实例为哪个容器服务,值通常为css选择器字符串
data:{
name:'Vue',
url:'百度一下,你就知道'
} // data中用于存储数据,数据供e1所指定的容器去使用
})
在容器内利用“插值语法{{}}”读取data数据:
<div id="root">
<h3>你好,{{name}}</h3>
</div>