<add>(create-api): $updateProps + (picker): watch selectedIndex (#131)

* <add>(create-api): $updateProps + (picker): watch selectIndex

* <delete> immediate

example/pages/picker.vue

@@ -4,8 +4,9 @@
       <cube-button-group>
         <cube-button @click="showPicker">Picker</cube-button>
         <cube-button @click="showMutiPicker">Multi-column Picker</cube-button>
-        <cube-button @click="showAliasPicker">Use Alias</cube-button>
-        <cube-button @click="showSetDataPicker">Use SetData</cube-button>
+        <cube-button @click="showAliasPicker">Use alias</cube-button>
+        <cube-button @click="showSetDataPicker">Use setData</cube-button>
+        <cube-button @click="showUpdatePropsPicker">Use $updateProps</cube-button>
         <cube-button @click="showNormalTimePicker">Normal Time Picker</cube-button>
       </cube-button-group>
     </div>
@@ -55,6 +56,14 @@
         onCancel: this.cancelHandle
       })
 
+      this.updatePropsPicker = this.$createPicker({
+        title: 'Use $updateProps',
+        data: [data1],
+        selectedIndex: [0],
+        onSelect: this.selectHandle,
+        onCancel: this.cancelHandle
+      })
+
       this.normalTimePicker = this.$createNormalTimePicker({
         selectedIndex: [10, 20, 59],
         onSelect: this.selectHandle,
@@ -75,6 +84,16 @@
         this.setDataPicker.setData([data1, data2, data3], [1, 2, 3])
         this.setDataPicker.show()
       },
+      showUpdatePropsPicker() {
+        this.updatePropsPicker.show()
+        setTimeout(() => {
+          this.updatePropsPicker.$updateProps({
+            title: 'Updated',
+            data: [data1, data2, data3],
+            selectedIndex: [1, 2, 3]
+          })
+        }, 1000)
+      },
       showNormalTimePicker() {
         this.normalTimePicker.show()
       },

src/common/helpers/instantiate-component.js

@@ -29,5 +29,9 @@ export default function instantiateComponent(Vue, Component, data, renderFn) {
   instance.$mount()
   instance.init()
   const component = instance.$children[0]
+  component.$updateProps = function (props) {
+    Object.assign(renderData.props, props)
+    instance.$forceUpdate()
+  }
   return component
 }

src/components/picker/picker.vue

@@ -174,6 +174,7 @@
             let wheelWrapper = this.$refs.wheelWrapper
             for (let i = 0; i < this.pickerData.length; i++) {
               this._createWheel(wheelWrapper, i).enable()
+              this.wheels[i].wheelTo(this.pickerSelectedIndex[i])
             }
             this.dirty && this._destroyExtraWheels()
             this.dirty = false
@@ -293,8 +294,11 @@
       }
     },
     watch: {
-      data(newData) {
-        this.setData(newData, this.selectedIndex)
+      data(newVal) {
+        this.setData(newVal, this.selectedIndex)
+      },
+      selectedIndex(newVal) {
+        this.setData(this.data, newVal)
       }
     },
     components: {