feat(composition api): computed

pages/composition-api/reactivity/computed/computed.test.js

+const PAGE_PATH = '/pages/composition-api/reactivity/computed/computed'
+
+describe('computed', () => {
+  if (process.env.uniTestPlatformInfo.startsWith('android')) {
+    let page = null
+    beforeAll(async () => {
+      page = await program.reLaunch(PAGE_PATH)
+      await page.waitFor('view')
+    })
+    it('basic', async () => {
+      const count = await page.$('#count')
+      expect(await count.text()).toBe('count: 0')
+      const doubleCount = await page.$('#double-count')
+      expect(await doubleCount.text()).toBe('computed double count: 0')
+
+      const objArr = await page.$('#obj-arr')
+      expect(await objArr.text()).toBe('obj.arr: [1,2,3]')
+      const objArrLen = await page.$('#obj-arr-len')
+      expect(await objArrLen.text()).toBe('computed obj.arr.length: 3')
+
+      const updateBtn = await page.$('#update-btn')
+      await updateBtn.tap()
+
+      expect(await count.text()).toBe('count: 1')
+      expect(await doubleCount.text()).toBe('computed double count: 2')
+      expect(await objArr.text()).toBe('obj.arr: [1,2,3,4]')
+      expect(await objArrLen.text()).toBe('computed obj.arr.length: 4')
+    })
+  } else {
+    it('other platform', () => {
+      expect(1).toBe(1)
+    })
+  }
+})
\ No newline at end of file

pages/composition-api/reactivity/computed/computed.uvue

- <template><view class="page">computed</view></template>
+<template>
+  <view class="page">
+    <text id="count" class="uni-common-mb">count: {{ count }}</text>
+    <text id="double-count" class="uni-common-mb">computed double count: {{ doubleCount }}</text>
+    <text id="obj-arr" class="uni-common-mb">obj.arr: {{ obj.arr }}</text>
+    <text id="obj-arr-len" class="uni-common-mb">computed obj.arr.length: {{ objArrLen }}</text>
+    <button id="update-btn" @click="update">update</button>
+  </view>
+</template>
+
+<script setup>
+  const count = ref(0)
+
+  const doubleCount = computed<number>(() : number => {
+    return count.value * 2
+  })
+
+  type Obj = {
+    arr : number[]
+  }
+
+  const obj = reactive({
+    arr: [1, 2, 3]
+  } as Obj)
+
+
+  const objArrLen = computed<number>(() : number => {
+    return obj.arr.length
+  })
+
+  const update = () => {
+    count.value++
+    obj.arr.push(obj.arr.length + 1)
+  }
+</script>
\ No newline at end of file

pages/tab-bar/composition-api.uvue

@@ -91,7 +91,7 @@
           {
             name: 'computed',
             url: 'computed',
-            enable: false,
+            enable: true,
           },
           {
             name: 'reactive',