radio.vue 1.3 KB
<template>
  <div class="radio-control" v-bind:class="layoutClass">
    <template v-for="item in list">
      <input type="radio" :value="item.value || item" v-model="checked" :id="uuid + $index" :disabled="disabled">
      <label class="radio" :for="uuid+ $index">{{item.label || item}}</label>
    </template>
  </div>
</template>
 <!-- :class="{'radioStyle':item.radioStyle}" -->
<script>
  module.exports = {
    props: {
      radioStyle:{
        default:false,
        type:Boolean
      },
      list: {
        type: Array,
        default: function () {
          return [{
            value: '1',
            label: '是'
          }, {
            value: '0',
            label: '否'
          }];
        }
      },
      layout: {
        type: Array,
        default: ''
      },
      checked: {
        twoWay: true
      },
      disabled: true,
    },
    computed: {
      layoutClass: function () {
        var clazz = [];
        for (var i = 0, len = this.layout.length; i < len; i++) {
          if (this.layout[i] === 'control') {
            continue;
          }
          clazz.push('radio-' + this.layout[i]);
        }
        return clazz;
      }
    },
    data: function () {
      return {
        uuid: 'radio_' + Math.random().toString().substr(2).toString(32)
      };
    }
  };

</script>