uni-app课程笔记1—基本知识点

基本知识点

不建议data:{}的格式,保留上次的变量值,不会被初始化。

v-bind --- :
v-on --- @
v-model --- 双向绑定

自定义组件

关联组件

定义组件之后,页面通过下述语句引用

import btn from '...'
components: {  btn }

页面往组件传送数据

传送数据

页面中传入的color="red",在子组件中通过下述语句引用到。

props:{ 
	color: { 
		type:String,
		default:'#000'
	}
}
传送事件(点击事件等改变状态)

页面上写上 @change="change",组件中的按钮事件中

onClick(){ 
	this.$emit('change', this.color)
	}

组件内接收,变成正常的组件

在子组件中加入<slot></slot>插槽

条件编译

#ifdef___#endif
#ifndef

在页面中<!-- #ifdef H5 -->
在script中// #ifdef
在样式中 /* #ifdef H5 */

开发布局

引入@import ‘...'

生命周期

应用生命周期–app.vue

onLaunch

应用初始化完成触发一次,全局只触发一次
登陆 全局变量

onShow

应用启动的时候,或者从后台进入前台会触发

onHide

应用从前台进入后台触发

页面生命周期–页面中写

onLoad

监听页面加载
onReady 监听页面的初次渲染完成
如果渲染速度快,会在页面进入动画完成前触发

onShow

监听页面显示

onHide

监听页面隐藏

onUnload

监听页面卸载

子组件生命周期

beforeCreate

在实例初始化之后,数据观测(data observer)和event/watcher事件配置之前被调用

created

实例创建完成之后立即调用,挂载阶段还没开始

mounted

挂载到实例上去之后调用

destroyed

实例销毁后调用