feat(radio): mdc-radio's init should follow v-model when checked prop…

… is unset? #155 closes #155
stasson · Dec 19, 2017 · 5e3263d · 5e3263d
1 parent d22cf3c
commit 5e3263d
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 5 deletions.
diff --git a/components/radio/README.md b/components/radio/README.md
@@ -24,7 +24,7 @@ var vm = new Vue({
 |`align-end`| Boolean|| align the radio after the label |
 |`name`|String|| radio group name  |
 |`value`|String| `label`| radio value, defaults to label value if any |
-|`checked`|Boolean|| whether this radio is selected by default |
+|`checked`|Boolean|| forces this radio to be selected. follows v-model otherwise |
 |`:disabled`| Boolean|| whether the radio is disabled |
 |`v-model`| String || tracks selected radio's value |
 

diff --git a/components/radio/demo.vue b/components/radio/demo.vue
@@ -9,7 +9,7 @@
 export default {
   data () {
     return {
-      picked:false,
+      picked:'',
     }
   }
 }

diff --git a/components/radio/mdc-radio.vue b/components/radio/mdc-radio.vue
@@ -27,10 +27,11 @@ export default {
   props: {
     'name': String,
     'value': String,
+    'picked': String,
     'checked': Boolean,
     'label': String,
     'align-end': Boolean,
-    'disabled': Boolean
+    'disabled': Boolean,
   },
   data () {
     return {
@@ -52,7 +53,7 @@ export default {
     this.foundation.init()
     this.foundation.setValue(this.value ? this.value : this.label)
     this.foundation.setDisabled(this.disabled)
-    this.foundation.setChecked(this.checked)
+    this.foundation.setChecked(this.checked || this.picked == this.foundation.getValue())
 
     // add ripple
     this.ripple = new RippleBase(this, {
@@ -89,7 +90,7 @@ export default {
     this.ripple.destroy()
   },
   watch: {
-    'disabled' (value) {
+    disabled (value) {
       this.foundation.setDisabled(value)
     }
   },