Year has passed, although the epidemic is still raging, but I believe we do not want to have friends from the victory ...
Recently foreground are learning framework vue, learning-by-note, O (∩_∩) O
Vue is a progressive frame for constructing user interfaces
Vue is designed to be applied from the bottom up layer by layer. Vue core library focus only on the view layer, is not only easy to use but also easy to integrate third-party libraries or existing project.
Vue follow MVVM pattern
M: model, i.e. the model, can be understood as a fixed format var vm = new Vue () {el: '# xxx', data: {}} is data
V: View, i.e. views, i.e. <div id = 'xxx'> </ div>
VM: Vue instance of an object, generally designated vm
Coding examples:
<div id="app">
<input type="text" v-model="username">
<p>Hello, {{username}}</p>
</div>
//通过script标签引入vue.js
<script type="text/javascript" src="../js/vue.js"></script>
<script type="text/javascript">
//创建vue实例对象
new Vue({
el: '#app',//el：element元素
data: {
username: 'atguigu'
}})</script>Code Interpretation:
new view ({
el: '#app', // div corresponding to the id, the instance management area corresponding to vue
data: {
// data can be seen as a first mode MVVM M
}
})
<div id="app"></div>
This group div MVVM pattern can be seen as a second V
Methods curly brackets {} {} expression, such as <p> Hello, {{username}} </ p> in the username, for outputting data to the page, the object can be called
Command (in the beginning of the custom label attributes v-, such as v-model = "username")
