Core steps:
1. Prepare the container
2. Yinbao (official website) - development version (used during the development process) / production version (used after going online)
Official website:
1) view2: view.js
2)vue3: Vue.js - Progressive JavaScript framework | Vue.js
Development version:
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>Production version:
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>3. Create a Vue instance new Vue()
4. Specify configuration items->render data
1)el specifies the mount point
2)data provides data
<div id="app">
{
{msg}}
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script>
const app=new Vue({
el:'#app',
data:{
msg:'Hello'
}
})
</script>Responsive features
Responsive data: When the data changes, the view automatically updates.
The data in data will be added to the instance.
1.Access data instance.property name
2. Modify data instance.Attribute name = new value