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

refactor(reactivity): readonly

上级 8466d59d
......@@ -486,6 +486,11 @@ export default {
name: 'reactive',
url: 'reactive/reactive'
},
{
id: 'readonly',
name: 'readonly',
url: 'readonly/readonly'
},
]
}
] as Page[]
......
const PAGE_PATH = '/pages/composition-api/reactivity/readonly/readonly'
const PAGE_PATH = '/pages/reactivity/core/readonly/readonly'
describe('ref', () => {
let page = null
......@@ -8,37 +8,37 @@ describe('ref', () => {
})
it('basic', async () => {
const dataStr = await page.$('#data-str')
expect(await dataStr.text()).toBe('data.str: default str')
expect(await dataStr.text()).toBe('default str')
const dataNum = await page.$('#data-num')
expect(await dataNum.text()).toBe('data.num: 0')
const dataArr = await page.$('#data-arr')
expect(await dataArr.text()).toBe('data.arr: ["a","b","c"]')
expect(await dataNum.text()).toBe('0')
const dataArr = await page.$('#data-arr')
expect(await dataArr.text()).toBe('["a","b","c"]')
const readonlyDataStr = await page.$('#readonly-data-str')
expect(await readonlyDataStr.text()).toBe('readonly data.str: default str')
expect(await readonlyDataStr.text()).toBe('default str')
const readonlyDataNum = await page.$('#readonly-data-num')
expect(await readonlyDataNum.text()).toBe('readonly data.num: 0')
const readonlyDataArr = await page.$('#readonly-data-arr')
expect(await readonlyDataArr.text()).toBe('readonly data.arr: ["a","b","c"]')
expect(await readonlyDataNum.text()).toBe('0')
const readonlyDataArr = await page.$('#readonly-data-arr')
expect(await readonlyDataArr.text()).toBe('["a","b","c"]')
const updateDataBtn = await page.$('#update-data-btn')
await updateDataBtn.tap()
expect(await dataStr.text()).toBe('data.str: new str')
expect(await dataNum.text()).toBe('data.num: 1')
expect(await dataArr.text()).toBe('data.arr: ["a","b","c","d"]')
expect(await readonlyDataStr.text()).toBe('readonly data.str: new str')
expect(await readonlyDataNum.text()).toBe('readonly data.num: 1')
expect(await readonlyDataArr.text()).toBe('readonly data.arr: ["a","b","c","d"]')
expect(await dataStr.text()).toBe('new str')
expect(await dataNum.text()).toBe('1')
expect(await dataArr.text()).toBe('["a","b","c","d"]')
expect(await readonlyDataStr.text()).toBe('new str')
expect(await readonlyDataNum.text()).toBe('1')
expect(await readonlyDataArr.text()).toBe('["a","b","c","d"]')
const updateReadonlyDataBtn = await page.$('#update-readonly-data-btn')
await updateReadonlyDataBtn.tap()
expect(await dataStr.text()).toBe('data.str: new str')
expect(await dataNum.text()).toBe('data.num: 1')
expect(await dataArr.text()).toBe('data.arr: ["a","b","c","d"]')
expect(await readonlyDataStr.text()).toBe('readonly data.str: new str')
expect(await readonlyDataNum.text()).toBe('readonly data.num: 1')
expect(await readonlyDataArr.text()).toBe('readonly data.arr: ["a","b","c","d"]')
expect(await dataStr.text()).toBe('new str')
expect(await dataNum.text()).toBe('1')
expect(await dataArr.text()).toBe('["a","b","c","d"]')
expect(await readonlyDataStr.text()).toBe('new str')
expect(await readonlyDataNum.text()).toBe('1')
expect(await readonlyDataArr.text()).toBe('["a","b","c","d"]')
})
})
\ No newline at end of file
<template>
<view class="page">
<text id="data-str" class="mb-10">data.str: {{ data.str }}</text>
<text id="data-num" class="mb-10">data.num: {{ data.num }}</text>
<text id="data-arr" class="mb-10">data.arr: {{ JSON.stringify(data.arr) }}</text>
<view class="flex justify-between flex-row mb-10">
<text>data.str:</text>
<text id="data-str">{{ data.str }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>data.num:</text>
<text id="data-num">{{ data.num }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>data.arr:</text>
<text id="data-arr">{{ JSON.stringify(data.arr) }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>readonly data.str:</text>
<text id="readonly-data-str">{{ readonlyData.str }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>readonly data.num:</text>
<text id="readonly-data-num">{{ readonlyData.num }}</text>
</view>
<view class="flex justify-between flex-row mb-10">
<text>readonly data.arr:</text>
<text id="readonly-data-arr">{{ JSON.stringify(readonlyData.arr) }}</text>
</view>
<text id="readonly-data-str" class="mb-10">readonly data.str: {{ readonlyData.str }}</text>
<text id="readonly-data-num" class="mb-10">readonly data.num: {{ readonlyData.num }}</text>
<text id="readonly-data-arr" class="mb-10">readonly data.arr: {{ JSON.stringify(readonlyData.arr) }}</text>
<button id="update-data-btn" class="mb-10" @click="updateData">update data</button>
<button id="update-readonly-data-btn" @click="updateReadonlyData">update readonly data</button>
<button id="update-data-btn" class="mb-10" @click="updateData">
update data
</button>
<button id="update-readonly-data-btn" @click="updateReadonlyData">
update readonly data
</button>
</view>
</template>
<script setup>
type Data = {
str : string,
num : number,
arr : string[]
}
<script setup lang="uts">
type Data = {
str : string,
num : number,
arr : string[]
}
const data = reactive({
str: 'default str',
num: 0,
arr: ['a', 'b', 'c']
} as Data)
const data = reactive({
str: 'default str',
num: 0,
arr: ['a', 'b', 'c']
} as Data)
const readonlyData = readonly(data)
const readonlyData = readonly(data)
const updateData = () => {
data.str = 'new str'
data.num++
data.arr.push('d')
}
const updateData = () => {
data.str = 'new str'
data.num++
data.arr.push('d')
}
// #ifdef APP
const updateReadonlyData = () => {
readonlyData.str = 'new readonly str'
readonlyData.num++
readonlyData.arr.push('e')
}
// #endif
</script>
\ No newline at end of file
const updateReadonlyData = () => {
readonlyData.str = 'new readonly str'
readonlyData.num++
readonlyData.arr.push('e')
}
</script>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册
新手
引导
客服 返回
顶部