第二章 微信小程序（课后作业）

题目一：利用wx:if 以及wx:for数据绑定来实现输出乘法口诀表的编程

步骤一、打开微信开发者工具，在index.wxml输入代码，代码如下：

<!--index.wxml-->
<view class='con'>
  <view wx:for="{
  
  {[1,2,3,4,5,6,7,8,9]}}" wx:for-item="i"><!--对应行-->
    <view class='inline' wx:for="{
  
  {[1,2,3,4,5,6,7,8,9]}}" wx:for-item="j"><!--对应列-->
      <view wx:if="{
  
  {j<=i}}">
        {
  
  {i}}×{
  
  {j}}={
  
  {i*j}}
      </view>
    </view>
  </view>
</view>

步骤二、在index.scss输入以下代码：

/** index.scss **/
 
.con {
  font-size: 14px; 
  /** 设置字体大小 **/
  
  margin: 10px; 
  /** 设置外边距 **/
}
 
.inline {
  display: inline-block;
   /** 设置布局，一行显示，**/
 
  width: 65px; 
  /** 设置宽度 block的**/
}

步骤三：在index.json输入以下代码：

{
  "navigationBarBackgroundColor": "#000000",
  "navigationBarTitleText": "九九乘法表",
  "navigationBarTextStyle": "white",
  "backgroundTextStyle": "dar