Vue 应用实例的关键方法与配置案例一 460.07KB
chinayun_6401资源文件列表:
22vue应用实例方法与配置案例.zip 大约有18个文件 
22/- 22/01createApp/
22/01createApp/index.html 1.24KB - 22/01createApp/js/
- 22/01createApp/js/vue.global.js 525.07KB
- 22/02app.mount/
- 22/02app.mount/index.html 713B
- 22/02app.mount/js/
- 22/02app.mount/js/vue.global.js 525.07KB
- 22/03app.unmount/
- 22/03app.unmount/index.html 1015B
- 22/03app.unmount/js/
- 22/03app.unmount/js/vue.global.js 525.07KB
- 22/04app.component/
- 22/04app.component/defineComponent.html 802B
- 22/04app.component/index.html 763B
- 22/04app.component/js/
- 22/04app.component/js/vue.global.js 525.07KB
资源介绍:
本篇资源围绕 Vue 应用实例的关键方法与配置案例展开了讲述，具体有 createApp() 、 createSSRApp() 、 app.mount() 、 app.unmount() 、 app.component() 、 app.directive() 、 app.use() 、 app.mixin() 、 app.provide() 、 app.runWithContext() 、 app.version 、 app.config 、 app.config.errorHandler 、 app.config.warnHandler 、 app.config.performance 、 app.config.compilerOptions 、 app.config.globalProperties 、 app.config.optionMergeStrategies 。每一个案例皆为作者自行编写创作，借由自身经验使初学者能够迅速把握其中的知识点。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>createApp</title>
<script src="js/vue.global.js"></script>
</head>
<body>
<div id="app"></div>
</body>
<script>
const {createApp}=Vue
// 根组件选项对象
const rootComponent={
data() {
return {
localDescription: this.description // 初始化本地数据
};
},
methods:{
changeMessage(){
this.localDescription='更新描述'
}
},
template:`
<div>
<h2>{{title}}</h2>
<p>{{ localDescription }}</p>
<button @click="changeMessage">更新数据</button>
</div>
`,
props:['title','description'],
watch: {
description(newValue, oldValue) {
console.log(newValue,oldValue)
}
}
};
// 创建应用实例，传递根组件和可选的props
const app = createApp(rootComponent,{
title:'标题',
description:'初始内容'
});
app.mount('#app')
</script>
</html> 相关资源