uniapp动态显示数组_uni-app学习：4、数据绑定（变量、数组、显示控制）
基本等同与vue，把代码跑一下，看看就明白了。
其中，
v-hidden 貌似不管是 true or false 都有显示
v-show 才切换。
和vue 一样，数组循环中要加key绑定，只不过如果不加的话会有警告。
{{index}} - {{item.name}}
测试源码
{{title}}
-------数据绑定展示 基本数据-------
{{name}}
-------数据绑定展示 数组-------
{{index}} - {{item.name}}
这里是条件展示的内容....是否显示if {{show_if}}
这里是条件展示的内容....是否隐藏 {{show_hidden}}
var _self;
export default {
data() {
return {
title: 'Hello....',
name: 'hcoder',
students: [{
name: "张三",
age: 18
},
{
name: "李四",
age: 20
},
{
name: "王二",
age: 60
}
],
show_if: false,
show_hidden: true,
count: 0,
}
},
onLoad() {
_self = this;
setInterval(function() {
_self.count++;
console.log('第几次='+_self.count);
if (_self.count > 10) {
_self.show_if = true;
_self.show_hidden=false
}
if (_self.count > 20) {
_self.show_if = false;
_self.show_hidden=true;
_self.count = 0;
}
}, 2000);
},
methods: {
}
}
.content {
text-align: center;
height: 400upx;
}
.logo {
height: 200upx;
width: 200upx;
margin-top: 20upx;
}
.title {
font-size: 36upx;
color: #8f8f94;
}
h5 {
margin-top: 10px;
}
效果
总结
以上是生活随笔为你收集整理的uniapp动态显示数组_uni-app学习：4、数据绑定（变量、数组、显示控制）的全部内容，希望文章能够帮你解决所遇到的问题。
- 上一篇： 未定义的引用_Rust 引用和借阅
- 下一篇： 箱线图怎么判断异常值_箱形图（Box-p