uni-app学习日记1

uniapp很大程度上使用vue语法。但是有一点不兼容。

数据绑定

初始化数据
//方法一：JS方法，不推荐，会保留上次的变量值
data:{
     },
//方法二：
data() {
     
			return {
     
				
			}
		},

动态绑定属性 v-bind——：
:class="classXX"(不要大括号)
事件绑定    v-on——@
@clink="vue"
数据绑定   ————双大括号
{
     {
     Data?'VUE':'JS'}}
数据双向绑定		<view v-model="vaule">

JS中的变量改变方法：
this.setData({
     
     title:'hellow world'
})
VUE更加简单：
this.title='hello world'

条件判断

v-if使用方法：
1、v-if=false/true
2、v-if="show"
   show:true/false
3、v-if="show==='APP'"
   show:APP

if else 虽迟但到
       	<view v-if="textShow">VUE</view>
		<view v-else-if="textShow">C++</view>
		<view v-else>JS</view>

列表渲染

for循环
        //数组循环
		<view v-for="(item,index) in dataList" :key="index">
			{
     {
     (index+1)+' '+item}}
		</view>
		//对象循环
		<view v-for="(item,vaule) in dataList" >
			{
     {
     vaule+':'+item}}
		</view>

基础组件

uni-app为开发者提供了一系列基础组件

自定义组件

创建自定义组件

名字一定要写 components！！！！！！！！

完成后如下：

使用自定义组件

组件与页面的事件传递

• 自定义组件发送
  

• 页面接收