selectbBar props

属性	描述	类型	默认值
titleText	标题文案	string	-
loadingSize	loading状态下loading图标的大小	number	14
loadingColor	loading状态下loading图标的颜色	string	#ffffff
buttonText	按钮文案	string	-
buttonBackgroundColor	按钮背景色	string	-
buttonColor	按钮字体颜色	string	-
buttonFontSize	按钮字体大小	number	-
buttonDisabled	是否禁用按钮	boolean	false
disabledBackgroundColor	禁用按钮的背景色	string	#333333
disabledColor	禁用按钮的字体颜色	string	#ffffff
height	高度	number	46
value	选中的值	string	-
loading	loading状态可结合v-model使用	boorder	false

selectbBar events

事件	说明	回调参数
submit	按钮点击事件	event
toggle	当loading状态不是用v-model绑定时，可通过此法发接收变化后的状态值	data

例子代码

<template>
  <div>
    <div class="items">
      <p class="item_title">基础</p>
      <vill-select-bar titleText="已选择" buttonText="确认"/>
    </div>
    <div class="items">
      <p class="item_title">自定义</p>
      <vill-select-bar
        titleText="已选择"
        buttonText="确认"
        buttonBackgroundColor="orange"
        buttonColor="#cccccc"
        :buttonFontSize="16"
        :height="38"
        value="商品1"
      />
    </div>
    <div class="items">
      <p class="item_title">禁用按钮</p>
      <vill-select-bar
        titleText="已选择"
        buttonText="确认"
        :buttonDisabled="true"
      />
    </div>
    <div class="items">
      <p class="item_title">自定义禁用按钮</p>
      <vill-select-bar
        titleText="已选择"
        buttonText="确认"
        :buttonDisabled="true"
        disabledBackgroundColor="red"
      />
    </div>
    <div class="items">
      <p class="item_title">loading</p>
      <vill-select-bar
        titleText="已选择"
        buttonText="确认"
        v-model="loading"
      />
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loading: true
    }
  },
  created() {
    setTimeout(() => {
      this.loading = false
    }, 3000)
  },
}
</script>