小程序开发基础学习二

1、事件绑定：

<view>
  <input bindinput="handleInput"></input>
  <button bindtap="handletap" data-operation="{{1}}">+</button>
  <button bindtap="handletap" data-operation="{{-1}}">-</button>
  <view>{{num}}</view>
</view>

Page({

  /**
   * 页面的初始数据
   */
  data: {
    num: 0
  },
  // 输入框的input事件的执行逻辑
  handleInput(e) {
    console.log('打印了')
    this.setData({
      num: e.detail.value
    })
  },
  // 按钮的加减点击事件
  handletap(e) {
    // 获取自定义属性
    const operation = e.currentTarget.dataset.operation;
    this.setData({
      num: this.data.num + operation
    })
  },

2、样式rpx:

image.png image.png

3、样式导入：

使用@import语句导入外联样式表，只支持相对路径。

4、小程序中使用less：

原生小程序是不支持less，借助vscode安装插件Easy LESS即可。