注意:以下文档只适用于TOP接口,请谨慎使用!

文档中心 > 天猫精灵IoT开放平台

InputNumber 加减输入框

更新时间:2019/05/20 访问次数:1240

参数


参数 说明 类型 可选值 默认值
value 取值 number —— 0
disabled 禁用 boolean —— false
disabledColor 禁用颜色 string —— #DCDDE2
min 最小值 number —— 0
max 最大值 number —— 100
step 步长 number —— 1
prefix 前缀 string —— ——
suffix 后缀 string —— ——
themeColor 主题颜色 string —— #0082FF
labelColor 文字颜色 string —— #FFF
disabledLabelColor 禁用文字颜色 string —— #FFF
hasBorder 是否有边框 boolean —— false

Events


事件名称 说明 回调参数
change 更改事件 (type, value) // 点击加减,改变的值

使用示例

<template>
  <div class="inputNumber">
    <input-number v-model="humidity" :max="5" @change="onChange" suffix="°C"></input-number>
  </div>
</template>
<script>
import { InputNumber } from 'genie-ui'

export default {
  components: {
    InputNumber
  },

  computed: {
    // 通过 vuex 来获取和设置湿度
    humidity: {
      get: function () {
        return this.$store.state.publicInfo.attr.humidity;
      },
      set: function (val) {
        this.$store.dispatch('setDeviceStatus', {
          humidity: val
        })
      }
    },
  },

  data () {
    return {

    }
  },

  methods: {
    onChange (type, v) {
      console.log('change:', type, v)
    }
  }
}
</script>

FAQ

关于此文档暂时还没有FAQ
返回
顶部