uniapp的bug们

 1 uni-icons标签的数据绑定有问题

<uni-icons type="contact" class=" icon"  size="25"></uni-icons><span style="font-size: 25px;"><span>{{user_msg}}</span>
<!-- 之所以不把{{user_msg}}写在uni-icons标签之内,是因为,uni-icons有一个bug,它在微信小程序模拟器不支持数据绑定,但浏览器可以,因此干脆把数据放在uni-icons之外 -->

2 vue2的tihs"迷路"问题

uni.getStorage({
    key:'user_ID',
    // success: function (res) {
    // 	this.user_ID=res.data;//非箭头函数的this,会"绑定丢失",这是vue2的bug,为了规避这个bug,发明了箭头函数
    // 	console.log('res.data',res.data);
    // }
    success: (res) => { // 使用箭头函数  
        this.user_ID = res.data; // 这里的 this 将会指向外部作用域的 this  
        console.log('res.data', res.data);  
    },
})

3 uniapp,右对齐bug

<view class="you"><view><button type="primary" size="mini">删 除</button></view></view>

.you{
  display: flex;  /*使之灵活,只有加这句话,居中才能生效*/
  justify-content: flex-end; /* 内部标签水平最后, right在小程序没有用,但是,浏览器有用 */  
}

当justify-content为right时

只有flex-end

但在浏览器中,flex-end和right都是有效的

 

4 uniapp的button,有很大的占位,使用css都限制不住他

5 普通button没有这个bug

可以在外面套一层view,间接限制其宽度

6 uni-card的v-for和v-if 同时使用时候会出问题

<uni-card   
    v-for="(card, index) in cards"   
    :key="index"   
    :title="card.title"   
    :extra="card.extra"  
    v-if="card.out_time==''"
>

<!-- out_time很明显是存在的 -->
<script>
export default {
    data() {
        return {
            cards: [
                { id: 1,title: '卡片1', extra: '信息1', content: '这是卡片1的内容',in_time:'2020',out_time: ''  },  
                { id: 2, title: '卡片2', extra: '信息2', content: '这是卡片2的内容',in_time:'2020',out_time: '2021'   },  
                { id: 3, title: '卡片3', extra: '信息3', content: '这是卡片3的内容',in_time:'2020',out_time: '2021'   },  
            ]
        }
    },
</script>

 

 如果将out_time放在其他位置,则没有问题

<uni-card   
    v-for="(card, index) in cards"   
    :key="index"   
     :title="card.title"   
    :extra="card.out_time"  
>  

规避方法,不在uni-card标签内使用v-for,在外面嵌套的view内使用

<view v-for="(card,index) in cards" :key="card.id">
	
	
	<uni-card   
	  v-if ="card.out_time!=''"
	  :title="card.title"   
	  :extra="card.extra"  
	>  
	  <text class="uni-body">{{ card.content }}</text>  
	</uni-card>
	
</view>

7 钩子函数一个写成下图的格式,如果写成箭头函数们会导致this"迷路"