<template>
  <div class="e-radio">
    <slot></slot>
  </div>
</template>
<script>
  export default{
    name:'emmm-radio',
    data(){
      return {
        currentValue: this.value
      }
    },
    props:{
      value: {
        type: [String, Number],
        default: null
      }
    },
    watch: {
      value (val) {
        this.updateValue()
      }
    },
    methods: {
      updateValue () {
        const value = this.value
        this.childrens = this.$children.filter(item => item.$options.name === 'emmm-radio-item')
        if (this.childrens) {
          this.childrens.forEach(child => {
            //console.log(child.checked);
            child.checked = value === child.value
          })
        }
      },
    change (val) {
        this.currentValue = val
        this.updateValue()
        this.$emit('input', val)
      }
    },
    mounted () {
        this.$nextTick(this.updateValue)
    }
}
</script>
<style>
@import './radio.css';
</style>
