Taro Hooks useEffect 第二个参数设置为`[]`执行一次的语法实际上执行两次
-
Taro Hooks useEffect 第二个参数设置为
[]
执行一次的语法实际上执行两次https://github.com/NervJS/taro/issues/4493
问题描述
Taro Hooks useEffect 第二个参数设置为[]
执行一次的语法实际上执行两次复现步骤
- 目标是使用
mobx
在组件间共享状态,新建store
全局状态 - 希望执行
useEffect
一次,第二个参数设置为[]
,并在回调中修改store
状态 - 结果会造成
useEffect
回调实际执行两次
import Taro, { useEffect } from '@tarojs/taro' import { observer } from '@tarojs/mobx' import { View } from '@tarojs/components' import { observable } from 'mobx' const store = observable({ count: 0 }) function Test() { const { count } = store useEffect( () => { console.log('useEffect') store.count = 1 }, [] ) return ( <View>{count}</View> ) } export default observer(Test)
期望行为
执行useEffect
回调一次=> useEffect
报错信息
执行useEffect
回调两次=> useEffect => useEffect
系统信息
Taro v1.3.18 weapp package.json "mobx": "4.8.0" System: OS: Windows 10 Binaries: Node: 10.15.3 - C:\Program Files\nodejs\node.EXE Yarn: 1.15.2 - C:\Users\EDZ\AppData\Roaming\npm\yarn.CMD npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
补充信息
- 实际上我使用
React Hooks
+mobx-react
+mobx
不会导致该问题 - 可能是因为在回调中修改
store
会导致这个错误,不知道是否还有其他方式去修改全局store
Taro
+@tarojs/mobx
依然存在该问题import Taro, { useEffect } from '@tarojs/taro' import { useLocalStore } from '@tarojs/mobx' import { View } from '@tarojs/components' function Test() { const store = useLocalStore(() => ({ count: 0 })) useEffect( () => { console.log('useEffect') store.count = 1 }, [] ) return ( <View>{store.count}</View> ) } export default Test
- 目标是使用