PmCheckbox 复选框

继承自 el-checkbox (opens new window) 并扩展了数据接入方式

静态数据

<template>
  <pm-checkbox :initData="data" v-model="value">
  </pm-checkbox>
</template>
<script>
export default {
  data () {
    return {
      value: "1",
      data: [
        {
          value: "1",
          label: "火锅"
        },
        {
          value: "2",
          label: "砂锅"
        },
        {
          value: "3",
          label: "地锅鸡"
        }
      ]
    }
  },
  methods: {
  }
}
</script>

显示代码 复制代码 复制代码

对接Api

<template>
  <pm-checkbox v-model="value"
      action="UserController.queryUsers" 
      dataField="data" 
      labelField="name" 
      valueField="id"
      :params="{enable:true}"
  >
  </pm-checkbox>
</template>
<script>
export default {
  data () {
    return {
      value: "1",
    }
  },
  methods: {
  }
}
</script>

显示代码 复制代码 复制代码

Button

<template>
  <pm-checkbox :initData="data" checkboxType="button" v-model="value">
  </pm-checkbox>
</template>
<script>
export default {
  data () {
    return {
      value: "1",
      data: [
        {
          value: "1",
          label: "火锅"
        },
        {
          value: "2",
          label: "砂锅"
        },
        {
          value: "3",
          label: "地锅鸡"
        }
      ]
    }
  }
}
</script>

显示代码 复制代码 复制代码

Attributes

参数	说明	类型	可选值	默认值
checkboxType	单选框类型	string	button	normal
action	Api方法	Object	-	null
dataField	Api方法返回值对应的数组字段名,如返回数组则可为空	string	-	null
params	方法参数	array,object,string	-	null
valueField	value对应的字段	string	-	value
labelField	label对应的字段	string	-	label
initData	静态数据	array	-	null