VUE概述

一、生命周期视图

VUE概述

 


 

二、vue是怎样改变dom元素的内容的

VUE概述

 


 

三、实例1:体验vue响应式程序

VUE概述

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="js/vue.js"></script>
</head>

<body>
    <div id="red">{{message}}</div>
    <div class="blue">
        <h1>{{light}}</h1>
        <h2>{{dark}}</h2>
    </div>
    <script>
        const app = new Vue({
            // el属性:决定Vue对象(app)会挂载到"#red"元素上去
            el:'#red',
            data:{
                message:'我是红色!'
            }
        })
        const app2 = new Vue({
            el:'.blue',
            data:{
                light:'我是浅蓝色',
                dark:'我是深蓝色'
            }
        })
    </script>
</body>

</html>

VUE概述

在console控制台可以直接进行数据的转变:

VUE概述


 

四、其他

1. const:定义变量

// const定义的可以改变里面的值
const ko = '1';
ko = '5'

 

2. let:定义常量

// let定义的可以不可以改变里面的值
let ko = '5';
ko = '8' // X 报错,不能改变

 

上一篇:Linux中module模块的编译、加载、卸载


下一篇:把编译好的ko文件加载模块时出错:Error: could not insert module hello_world.ko: Invalid module format