提交 f1e74d1e 编写于 作者: DCloud-WZF's avatar DCloud-WZF 💬

refactor(reactivity): toRaw

上级 bc45ee50
...@@ -617,6 +617,11 @@ export default { ...@@ -617,6 +617,11 @@ export default {
name: 'shallowRef', name: 'shallowRef',
url: 'shallow-ref/shallow-ref' url: 'shallow-ref/shallow-ref'
}, },
{
id: 'to-raw',
name: 'toRaw',
url: 'to-raw/to-raw'
},
] ]
} }
] as Page[] ] as Page[]
......
const PAGE_PATH = '/pages/composition-api/reactivity/to-raw/to-raw' const PAGE_PATH = '/pages/reactivity/advanced/to-raw/to-raw'
describe('toRaw', () => { describe('toRaw', () => {
let page = null let page = null
beforeAll(async () => { beforeAll(async () => {
page = await program.reLaunch(PAGE_PATH) page = await program.reLaunch(PAGE_PATH)
await page.waitFor('view') await page.waitFor('view')
}) })
it('basic', async () => { it('basic', async () => {
const checkToRawRef = await page.$('#check-to-raw-ref') const checkToRawRef = await page.$('#check-to-raw-ref')
expect(await checkToRawRef.text()).toBe('check toRaw ref: false') expect(await checkToRawRef.text()).toBe('false')
const checkToRawReactive = await page.$('#check-to-raw-reactive') const checkToRawReactive = await page.$('#check-to-raw-reactive')
expect(await checkToRawReactive.text()).toBe('check toRaw reactive: true') expect(await checkToRawReactive.text()).toBe('true')
const checkToRawReadonly = await page.$('#check-to-raw-readonly') const checkToRawReadonly = await page.$('#check-to-raw-readonly')
expect(await checkToRawReadonly.text()).toBe('check toRaw readonly: true') expect(await checkToRawReadonly.text()).toBe('true')
const checkToRawShallowReactive = await page.$('#check-to-raw-shallow-reactive') const checkToRawShallowReactive = await page.$('#check-to-raw-shallow-reactive')
expect(await checkToRawShallowReactive.text()).toBe('check toRaw shallowReactive: true') expect(await checkToRawShallowReactive.text()).toBe('true')
const checkToRawShallowReadonly = await page.$('#check-to-raw-shallow-readonly') const checkToRawShallowReadonly = await page.$('#check-to-raw-shallow-readonly')
expect(await checkToRawShallowReadonly.text()).toBe('check toRaw shallowReadonly: true') expect(await checkToRawShallowReadonly.text()).toBe('true')
}) })
}) })
\ No newline at end of file
<template> <template>
<view class="page"> <view class="page">
<text id="check-to-raw-ref">check toRaw ref: {{ checkToRawRef }}</text> <view class="flex justify-between flex-row mb-10">
<text class="mt-10" id="check-to-raw-reactive">check toRaw reactive: {{ checkToRawReactive }}</text> <text>check toRaw ref:</text>
<text class="mt-10" id="check-to-raw-readonly">check toRaw readonly: {{ checkToRawReadonly }}</text> <text id="check-to-raw-ref">{{ checkToRawRef }}</text>
<text class="mt-10" id="check-to-raw-shallow-reactive">check toRaw shallowReactive: </view>
{{ checkToRawShallowReactive }}</text> <view class="flex justify-between flex-row mb-10">
<text class="mt-10" id="check-to-raw-shallow-readonly">check toRaw shallowReadonly: <text>check toRaw reactive:</text>
{{ checkToRawShallowReadonly }}</text> <text id="check-to-raw-reactive">{{ checkToRawReactive }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>check toRaw readonly:</text>
<text id="check-to-raw-readonly">{{ checkToRawReadonly }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>check toRaw shallowReactive:</text>
<text id="check-to-raw-shallow-reactive">{{
checkToRawShallowReactive
}}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>check toRaw shallowReadonly:</text>
<text id="check-to-raw-shallow-readonly">{{
checkToRawShallowReadonly
}}</text>
</view>
</view> </view>
</template> </template>
<script setup> <script setup lang="uts">
const obj = {} const obj = {}
const refObj = ref(obj); const refObj = ref(obj);
const checkToRawRef = toRaw<UTSJSONObject>(refObj) === obj; const checkToRawRef = toRaw<UTSJSONObject>(refObj) === obj;
const reactiveObj = reactive(obj); const reactiveObj = reactive(obj);
const checkToRawReactive = toRaw<UTSJSONObject>(reactiveObj) === obj; const checkToRawReactive = toRaw<UTSJSONObject>(reactiveObj) === obj;
const readonlyObj = readonly(obj); const readonlyObj = readonly(obj);
const checkToRawReadonly = toRaw<UTSJSONObject>(readonlyObj) === obj; const checkToRawReadonly = toRaw<UTSJSONObject>(readonlyObj) === obj;
const shallowReactiveObj = shallowReactive(obj); const shallowReactiveObj = shallowReactive(obj);
const checkToRawShallowReactive = toRaw<UTSJSONObject>(shallowReactiveObj) === obj; const checkToRawShallowReactive = toRaw<UTSJSONObject>(shallowReactiveObj) === obj;
const shallowReadonlyObj = shallowReadonly(obj); const shallowReadonlyObj = shallowReadonly(obj);
const checkToRawShallowReadonly = toRaw<UTSJSONObject>(shallowReadonlyObj) === obj; const checkToRawShallowReadonly = toRaw<UTSJSONObject>(shallowReadonlyObj) === obj;
</script> </script>
\ No newline at end of file
...@@ -148,7 +148,7 @@ function transform(fileInfo, api) { ...@@ -148,7 +148,7 @@ function transform(fileInfo, api) {
- [x] shallowReactive - [x] shallowReactive
- [x] shallowReadonly - [x] shallowReadonly
- [x] shallowRef - [x] shallowRef
- [ ] toRaw - [x] toRaw
- [ ] triggerRef - [ ] triggerRef
## directives ## directives
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册