微信小程序条件语句和循环语句开发实例

　　微信小程序里最重要的两个语句类型就是条件语句和循环语句，今天小编为大家带来了微信小程序条件语句和循环语句的开发实例，希望能够帮助到大家。

　　在微信小程序的官方文档中，将这两个语句归化在小程序框架的视图层，分表叫条件渲染和类表渲染，其实他就是封装了这两条语句而已。

　　上图(循环语句if)

　　1.它是通过在index.js中设置数据，然后再index.wxml中进行判断，首先上index.wxml的代码。

　　//微信是封装过if语句的，你只要在index.js中设置好值，然后就可以直接想这样拿来判断了，还有这是class=“view”效果放在判断语句中是没有效果的

　　true

　　false

　　//三目运算，你可以比较一下这俩，上边判断true和false的方法，自己认为哪个简单用哪个

　　aa

　　bb

　　---------------------------

　　//其实挺简单的这样，相对于java和C++来说，这里直接写小程序判断的数据就OK了

　　你很棒

　　还算是个中国人

　　只能去日本了

　　---------------------------

　　//如果你一个判断条件下有好几个view就用block标签，他算是个万能标签，什么属*都可以往里写，所以遇到复杂的视图时记得用它。

　　你

　　很

　　叼

　　你

　　很

　　菜

　　2.index.js的代码，

　　var param={

　　data:{

　　you:true,

　　diao:18,

　　}

　　}

　　Page(param);12345671234567

　　3.index.wxss的代码

　　.view{

　　width: 100px;

　　height: 50px;

　　background-color: green;

　　color: white;

　　padding: 20px;

　　margin-top: 10px

　　}

　　注意：if和hidden的区别

　　二、循环语句for(其实在第8讲的button按钮中是有展示过的)

　　循环语句for呢，就是在index.js中把循环的数组，就是所有数据写进去，然后再index.wxml中进行逐一展示就行了。这里结合一下icon标签的属*

　　1.index.wxml

　　//因为要展示很多个icon，所以这里需要用到block标签。把index.js中写好的数组名字写在for的双括号中，然后在数组对应的属*下写进去item就ok了

　　------------------------------------

　　2.index.js

　　var param={

　　data:{

　　iconSize:[20,30,40,50,60,70],

　　iconColor:[ 'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple'],

　　iconType: [

　　'success', 'info', 'warn', 'waiting', 'safe_success', 'safe_warn',

　　'success_circle', 'success_no_circle', 'waiting_circle', 'circle', 'download',

　　'info_circle', 'cancel', 'search', 'clear'

　　]

　　}

　　}

　　Page(param)

　　如果是嵌套循环怎么办?

　　上代码

　　//重点在于给两个循环语句命名，然后去分别使用这两个语句

　　上效果图

　　微信小程序条件语句和循环语句的相关资料都在上文中了，大家看明白了吗?参照上述流程你就可以进行开发了，需要更多的资料请在微信小程序商店进行搜素。

　　微信小程序wx:if条件渲染

　　怎样解决微信小程序条件判断的问题?

　　微信小程序开发条件有哪些?