一、安装vue
1.直接引用script
<script src="https://unpkg.com/vue@next"></script>
或者安装脚手架
npm install -g @vue/cli
2.创建应用实例
<script>
const app =Vue.createApp({
data(){
return {
msg:"你好vue"}
}
})
var vm=app.mount("#app")
</script>
二、模板语法-文本渲染
1.v-text
<div id="app">
<p v-text="msg"></p>
</div>
<!-- 把app里面的内容称之为模板 -->
<!-- v-开头的属性称之为模板的指令 -->
<!-- 通过指令吧html模板和js联系在一起 -->
<script type="text/javascript">
Vue.createApp({
data() {
return{
msg:"666666"
}
}
}).mount("#app")
将vue实例中msg的内容展示在p标签里只需要在p标签内部写v-text
2.文本渲染指令{ {}}
<div id="app">
<p>{
{
msg}}</p>
<h1>{
{
msg}}</h1>
<p>{
{
1+2}}</p>
<