美文网首页
小程序随笔3:实现九九乘法表

小程序随笔3:实现九九乘法表

作者: 乌龟学跑步 | 来源:发表于2021-03-03 14:40 被阅读0次

    空学知识点,显得有点乏味,举个例子:实现九九乘法表。
    首先,更改下小程序的名字。
    这里涉及到全局配置文件app.json。这里是一些全局的配置,方便其他页面使用,我们要使用的是window标签下navigationBarTitleText,这里设置就更改小程序的名字了。


    小程序的名字

    代码如下:

    "window": {
        "backgroundTextStyle": "light",
        "navigationBarBackgroundColor": "#000",
        "navigationBarTitleText": "九九乘法表",
        "navigationBarTextStyle": "white"
      },
    

    其次,我们写一个页面。

    <view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="i">
        <view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="j">
          <view wx:if="{{i <= j}}">
            {{i}} * {{j}} = {{i * j}}
          </view>
        </view>
      </view>
    

    这里用到的两个点,一个知识点:wx:for,这是循环,两个表示两层套用来实现这个九九乘法表,[1, 2, 3, 4, 5, 6, 7, 8, 9]是数组,默认是index表示位置,item表示值,当然这里设置了指定item,wx:for-item="i", 用i来表示item;wx:for-item="j",则用j来表示item。具体想了解更多wx:for的用法可以去看官方文档,
    另一个知识点:wx:if,普通的判断,如果i<=j,执行下面的语句行,否则不执行。
    效果如下图所示:


    九九乘法表

    由于写的demo比较多,这里的九九乘法表是单独的一个页面,运行时为了看效果,直接打开这个页面,请注意配置app.json这个文件:
    1.page下增加一行, second是我新加的页面

    "pages": [
        "pages/index/index",
        "pages/logs/logs",
        "pages/second/second"
      ],
    

    2.设置入口文件路径

    "entryPagePath": "pages/second/second"
    

    特别注意:我们app.json文件内容用的JSON格式,JSON格式最大的优点是易于人的阅读和编写,通常不需要特殊的工具,就能读懂和修改,是一种轻量级的数据交换格式。

    JSON文件都是被包裹在一个大括号中 {},通过key-value的方式来表达数据。

    但是,编写 JSON 的时候,忘了给 Key 值加双引号或者是把双引号写成单引号是常见错误。

    另外,JSON的值只能是以下几种数据格式:
    数字,包含浮点数和整数
    字符串,需要包裹在双引号中
    Bool值,true 或者 false
    数组,需要包裹在方括号中 []
    对象,需要包裹在大括号中 {}
    Null
    其他任何格式都会触发报错。

    最后还需要注意的是 JSON 文件中无法使用注释,试图添加注释将会引发报错。

    此九九表就这样实现了。随笔记录,不喜勿喷。

    相关文章

      网友评论

          本文标题:小程序随笔3:实现九九乘法表

          本文链接:https://www.haomeiwen.com/subject/qtmqqltx.html