基本等同與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、数据绑定（变量、数组、显示控制）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。