feat(defineModel): 补充复杂类型示例及测试

pages/directive/v-model/Foo-composition.uvue

@@ -8,11 +8,18 @@
       <text>v-model:msg in Foo:</text>
       <text id="model-msg-text">{{ msg }}</text>
     </view>
-
     <view class="mb-10 flex justify-between flex-row">
       <text>defineModel num:</text>
       <text id="model-num-text">{{ num }}</text>
     </view>
+    <view class="mb-10 flex justify-between flex-row">
+      <text>defineModel strArr:</text>
+      <text id="model-str-arr-text">{{ JSON.stringify(strArr) }}</text>
+    </view>
+    <view class="mb-10 flex justify-between flex-row">
+      <text>defineModel numArr:</text>
+      <text id="model-num-arr-text">{{ JSON.stringify(numArr) }}</text>
+    </view>
     <button class="mb-10" id="update-value-btn" @click="updateValue">
       update value
     </button>
@@ -28,9 +35,14 @@ const msg = defineModel('msg', { type: String, default: 'default msg' })
 
 const num = defineModel('num', { type: Number, default: 1 })
 
+const strArr = defineModel<string[]>('strArr', { default: () => [] as string[] })
+const numArr = defineModel('numArr', {type: Array as PropType<number[]>, required: true })
+
 const updateValue = () => {
   modelValue.value += '1'
   msg.value += '2'
   num.value++
+  strArr.value.push(`${strArr.value.length}`)
+  numArr.value.push(numArr.value.length)
 }
 </script>

pages/directive/v-model/v-model-composition.test.js

@@ -19,10 +19,15 @@ describe('defineModel', () => {
     const modelMsgInput = await page.$('#model-msg-input')
     expect(await modelMsgInput.value()).toBe('msg')
     
-    const modelNumText = await page.$('#model-num-text')
-    expect(await modelNumText.text()).toBe('1')
-
-
+    const modelNumText = await page.$('#model-num-text')
+    expect(await modelNumText.text()).toBe('1')
+    
+    const modelStrArrText = await page.$('#model-str-arr-text')
+    expect(await modelStrArrText.text()).toBe('["0"]')
+    
+    const modelNumArrText = await page.$('#model-num-arr-text')
+    expect(await modelNumArrText.text()).toBe('[0]')
+    
     const updateValueBtn = await page.$('#update-value-btn')
     await updateValueBtn.tap()
     
@@ -32,7 +37,10 @@ describe('defineModel', () => {
     expect(await modelValueInput.value()).toBe('str1')
 
     expect(await modelMsgText.text()).toBe('msg2')
-    expect(await modelMsgInput.value()).toBe('msg2')
+    expect(await modelMsgInput.value()).toBe('msg2')
+    
+    expect(await modelStrArrText.text()).toBe('["0","1"]')
+    expect(await modelNumArrText.text()).toBe('[0,1]')
     
     const handleModelValueUpdateRes = await page.$('#handle-model-value-update-res')
     expect(await handleModelValueUpdateRes.text()).toBe('str1')

pages/directive/v-model/v-model-composition.uvue

@@ -3,8 +3,11 @@
     <Foo
       v-model="str"
       v-model:msg="msg"
+      v-model:strArr="strArr"
+      v-model:numArr="numArr"
       @update:modelValue="handleModelValueUpdate"
-      @update:msg="handleModelMsgUpdate" />
+      @update:msg="handleModelMsgUpdate"
+       />
     <input class="mb-10 input" id="model-value-input" v-model="str" />
     <input class="mb-10 input" id="model-msg-input" v-model="msg" />
     <view class="mb-10 flex justify-between flex-row">
@@ -23,6 +26,8 @@ import Foo from './Foo-composition.uvue'
 
 const str = ref('str')
 const msg = ref('msg')
+const strArr = ref<string[]>(['0'])
+const numArr = ref<number[]>([0])
 
 const handleModelValueUpdateRes = ref('')
 const handleModelValueUpdate = (val : string) => {