From 2e3b24f9797b53b8a43680505b81835cf28228ed Mon Sep 17 00:00:00 2001 From: zhenyuWang <13641039885@163.com> Date: Sun, 21 Apr 2024 15:54:44 +0800 Subject: [PATCH] refactor(reactivity): triggerRef --- pages/index/index.uvue | 5 +++ .../advanced/trigger-ref/trigger-ref.test.js | 8 ++-- .../advanced/trigger-ref/trigger-ref.uvue | 45 +++++++++++-------- ...ions-API-composition-API-correspondence.md | 2 +- 4 files changed, 37 insertions(+), 23 deletions(-) diff --git a/pages/index/index.uvue b/pages/index/index.uvue index 9501ad2..e850b23 100644 --- a/pages/index/index.uvue +++ b/pages/index/index.uvue @@ -622,6 +622,11 @@ export default { name: 'toRaw', url: 'to-raw/to-raw' }, + { + id: 'trigger-ref', + name: 'triggerRef', + url: 'trigger-ref/trigger-ref' + }, ] } ] as Page[] diff --git a/pages/reactivity/advanced/trigger-ref/trigger-ref.test.js b/pages/reactivity/advanced/trigger-ref/trigger-ref.test.js index 5f85adb..80866d2 100644 --- a/pages/reactivity/advanced/trigger-ref/trigger-ref.test.js +++ b/pages/reactivity/advanced/trigger-ref/trigger-ref.test.js @@ -1,4 +1,4 @@ -const PAGE_PATH = '/pages/composition-api/reactivity/trigger-ref/trigger-ref' +const PAGE_PATH = '/pages/reactivity/advanced/trigger-ref/trigger-ref' describe('triggerRef', () => { let page = null @@ -8,16 +8,16 @@ describe('triggerRef', () => { }) it('basic', async () => { const stateCount = await page.$('#state-count') - expect(await stateCount.text()).toBe('state.count: 0') + expect(await stateCount.text()).toBe('0') const incrementStateCountBtn = await page.$('#increment-state-count-btn') await incrementStateCountBtn.tap() - expect(await stateCount.text()).toBe('state.count: 0') + expect(await stateCount.text()).toBe('0') const triggerRefStateBtn = await page.$('#trigger-ref-state-btn') await triggerRefStateBtn.tap() - expect(await stateCount.text()).toBe('state.count: 1') + expect(await stateCount.text()).toBe('1') }) }) \ No newline at end of file diff --git a/pages/reactivity/advanced/trigger-ref/trigger-ref.uvue b/pages/reactivity/advanced/trigger-ref/trigger-ref.uvue index 5697945..9393d1d 100644 --- a/pages/reactivity/advanced/trigger-ref/trigger-ref.uvue +++ b/pages/reactivity/advanced/trigger-ref/trigger-ref.uvue @@ -1,25 +1,34 @@ <template> <view class="page"> - <text id="state-count" class="mb-10">state.count: {{ state.count }}</text> - <button id="increment-state-count-btn" class="mb-10" @click="incrementStateCount">increment - state.count</button> - <button id="trigger-ref-state-btn" @click="triggerRefState">trigger state</button> + <view class="flex justify-between flex-row mb-10"> + <text>state.count:</text> + <text id="state-count">{{ state.count }}</text> + </view> + <button + id="increment-state-count-btn" + class="mb-10" + @click="incrementStateCount"> + increment state.count + </button> + <button id="trigger-ref-state-btn" @click="triggerRefState"> + trigger state + </button> </view> </template> -<script setup> - type State = { - count: number - } - const state = shallowRef({ - count: 0 - } as State) +<script setup lang="uts"> +type State = { + count: number +} +const state = shallowRef({ + count: 0 +} as State) - const incrementStateCount = () => { - state.value.count++ - } +const incrementStateCount = () => { + state.value.count++ +} - const triggerRefState = () => { - triggerRef(state) - } -</script> \ No newline at end of file +const triggerRefState = () => { + triggerRef(state) +} +</script> diff --git a/refactor_options-API-composition-API-correspondence.md b/refactor_options-API-composition-API-correspondence.md index 4eea806..5016e2c 100644 --- a/refactor_options-API-composition-API-correspondence.md +++ b/refactor_options-API-composition-API-correspondence.md @@ -149,7 +149,7 @@ function transform(fileInfo, api) { - [x] shallowReadonly - [x] shallowRef - [x] toRaw -- [ ] triggerRef +- [x] triggerRef ## directives -- GitLab