微信小程序笔记-基本数据类型与页面数据的设置

本笔记基于个人理解，仅供大家参考，如有问题，还请各位大佬指正。

一、<text>与<view>

<text>与<view>标签的区别就像H5中的<span>与<div>

<text></text><text></text><text></text> 多个一列

<view></view> 独占一行显示

二、基本数据类型

在Page中的data设置页面初始数据

eg:

data:{                //不同的数据记得用  “，”  隔开

        msg:"hellow world", //字符串  要带上“”号   与   H5类似

        num:1000 , //数字类型

        isgirl:false , //布尔型

        //Object型  可以在里面放任意中基本数据类型

        Person:{         //理解为C++的类   或者  Java的对象

        age:20，

        name:"张三",

        isgril:"false",

        }

}

调用数据如下： 

作为文本：

        <!--1、字符串-->

        <view> {{msg}} </view>

        <!--2、数字-->

        <view> {{num}} </view>

        <!--3、布尔-->

        <view> 是不是女孩子：{{isgirl}} </view>

         <!--4、Object-->

        <view>{{Person.age}}</view>

        <view>{{Person.name}}</view>

        <view>{{Person.isgril}}</view>

特殊：

        <!--在标签作为属性-->        格式为:        data-*** ="{{***}}"

        <view data-num = "{{num}}">自定义属性</view>               //要用单双引号包裹

        在Wxml中可以看到  此时的num= 1000,

三、字符型在使用中的潜在问题

<!--使用bool类型充当属性时  在checked中-->

        <!--字符串和花括号之间不要出现空格-->

         <!--eg <checkbox checked="         {{ischecked}}"></checkbox>    这样是错误的  -->

                                            

<view>

      <!--一般不这样用，而是从新定义一个变量来取代 eg:  isChecked:false-->

      <checkbox checked="{{false}}"></checkbox>

</view>

<view>

      <checkbox checked="{{ischecked}}"></checkbox>

</view>

看到这里你可能疑惑，为啥要重新定义一个布尔型isChecked

直接checked="{{false}}"不就行了？

解释如下：

        当在项目开发的时候，可能需要大范围修改，将False改为True

如果这样，直接checked="{{false}}"的方法就需要一个个修改，

如果我们采用isChecked:false的形式，那么就只要修改为isChecked:true即可，不用再一个个改啦