《微信小程序开发实战》学习笔记Chapter02 wxml页面

最新推荐文章于 2023-04-15 11:26:56 发布

爱玩儿の编程小菜机

最新推荐文章于 2023-04-15 11:26:56 发布

阅读量356

点赞数 2

分类专栏：微信小程序学习笔记文章标签：微信小程序学习 servlet

本文链接：https://blog.csdn.net/Linn908/article/details/127464910

版权

本文详细介绍了微信小程序中数据绑定的使用，包括基本的变量声明和在WXML中的显示。同时，展示了如何进行简单的运算，如三元运算和算术、字符串及逻辑运算。此外，还详细讲解了列表渲染的实现，通过`wx:for`指令进行循环遍历数组和对象。最后，列举了常见的页面组件及其功能。

摘要由CSDN通过智能技术生成

Chapter02 wxml页面

1. 数据绑定

//在pages/index1/index1.js文件中：
Page({

  /**
   * 页面的初始数据
   */
  data: {
    msg: "hello", // 定义了一个叫msg的变量，冒号后要有一个空格
    mun: 99,
    isboy: false,
    person:{
      name:"小明",
      bumen:"搬砖部"
    },
    title:"你想吃啥？"
  },

//在pages/index1/index1.js文件中：
<!-- pages/index1/index1.wxml -->
<view>
    你是来自哪里的干饭人？

    //调用.js文件中的data数据
    <view>msg:{
 {msg}}</view>
    <view>mun:{
 {mun}}</view>
    <view>isboy:{
 {isboy}}</view>
    <view>person.name:{
 {person.name}}</view>
    <view>person.bumen:{
 {person.bumen}}</view>

    //组件属性
    <view data-id="{
 {title}}">title</view>

    //选中框的布尔属性要加大括号
    <view>
        <checkbox checked="{
 {false}}"></checkbox>
    </view>
</view&g