日常遇到的问题

1.输入框为空时弹出提示：

submi（e）{
       if (this.name=='') {
   //uni-app官网-API-界面-交互反馈-uni.showToast
          uni.showToast({
					//title-提示内容
				    title: '请输入用户名',
					//duration-提示的延迟时间
				    duration: 1000,
				})
				return ;						 
        }  
}

2.文字居中：
设置inline-height与height相等，添加**text-align:center;**属性

3.列表切换，数目少时直接写死

<view class="flex" >
<!-- 菜单少直接写死，用class判断条件，将0或1传值； -->
	<view class="flex-sub padding-sm margin-xs radius" 
		v-bind:class="TabCur==0? 'bgcolor' : 'bg' "    @click="getItem(0)">通知公告</view>
	<view class="flex-sub padding-sm margin-xs radius" 
		v-bind:class="TabCur==1? 'bgcolor' : 'bg' " @click="getItem(1)">新闻动态</view>				
</view>

在data数据中声明变量TabCur：0，定义一个空数组list[ ]，未调取接口时手动分类；
//接口传回直接分类好的,此处直接手动分类
方法代码：

getItem(index){
				// 点击哪个切换哪个
				console.log(index)
				this.TabCur =index;
				// 判断点击的是什么,将值传回空数组
				if(this.TabCur==0){
					this.list=[];	
					// 使用concat方法进行数组拼接
					this.list = this.list.concat(this.list1);
				}
				if(this.TabCur==1){
					this.list=[];
					this.list = this.list.concat(this.list2);
				}	
			}

4.点击按钮向数组中添加一组新数据

<view class="menu padding-md margin-left">
	<view class="margin-right" v-for="(site,index) in buttons" @click="DateChange(site,index)"  >
		<view class="img" style="margin-left: 7px;">
		      <image v-bind:src="site.img" mode="" style="width: 100%;height: 100%;"></image>
	    </view>
	    <view class="title" style="margin-top: 5px;">{{site.name}}
	    </view>	
	</view>		
</view>

数组：

buttons:[
	{img:'../../static/baoxiu.png',name:"报修系统"},
	{img:'../../static/xinzeng.png',name:"投诉系统"	},
	{img:'../../static/xunjian.png',name:"巡检系统"},
	{img:'../../static/shebei.png',name:"设备管理"	},
	{img:'../../static/shanghu.png',name:"商户服务"	},		
]

方法：

DateChange:function(site,index){
			// 添加一组新数据
			console.log(site)
			this.buttons.push({
				img:'../../static/chuli.png',
				name:"设备管理",
			})
			// 数据集合
			var userName = [];
			this.buttons.forEach(function(v){
				userName.push(v.name);
			});
			console.log(userName);
			
}

5.表单中 v-bind:disabled="flag"动态绑定属性值，正常情况下disabled="true"表示禁用表单输入域，增加时允许输入，修改时不允许输入；

<div class="book">
	<label for="id">编号</label> 
	<input type="text" id="id" v-model="id" v-bind:disabled="flag"/>
	<label for="name">名称</label>
	<input type="text" id="name" v-model="name" />
						
	<button @click="handle">提交</button>
</div>

6.以整张图片为背景图
根据不同需求设置不同属性；

body{
	background-image: url(./img/1.jpg);
	background-repeat: no-repeat;
	/* 1.背景图像将缩放，并尝试匹配内容区域。不过图像将保持其长宽比; */
	/* background-size: contain; */
	/* 2.背景图像将拉伸以覆盖整个内容区域 */
	/* background-size: 100% 100%; */
	/* 3.背景图像将缩放以覆盖整个内容区域，"cover" 值保持长宽比，且可能会裁剪背景图像的某部分： */
	background-size: cover;
}