Status signal component
about
The state data is encapsulated into a signal component. When the state data changes, the redirect component is automatically rendered.
interface SignalComponentType<State extends Dict>{
// 指定状态数据路径
(selector: string):React.ReactNode
// 返回状态数据的函数
(selector: (state:ComputedState<State>)=>React.ReactNode):React.ReactNode
}
prompt
You only need to specify the path of the status digital library or provide a function that returns the status data.
Synchronous signal component
use $ ('<State Path>')
will Status data is directly encapsulated as signal components when the status data changes, the re -rendering of the signal component is automatically triggered.
Note
Be updated Age
at the same time, the entire color block will not change to re -renders.
Combination synchronous signal component
use $((state)=>{.....})
the combination of multiple status data is created as a signal component. When the dependent state data changes, the signal component will automatically trigger re -rendering.
Asynchronous computing signal component
Use $ ('<State Path>')
will Status data is directly encapsulated as signal components at this time, if the status data is an asynchronous data object AsyncComputedValue
at that time, the object contains loading
,error
,value
properties.
- When the path specifies an asynchronous computing attribute, the signal component created will automatically add
value
property. Therefore, the above$('order.total')
and$('order.total.value')
it's equivalent.
Note
$('order.count')
and$('order.total.value')
it is equivalent. When creating a signal component, if the target is foundAsyncComputedValue
automatically addvalue
.- You may have noticed that the rendering color block components on the current page will not change. This is the charm of the fine particle -level update of the signal component. When the state changes, the rendering of the component is limited inside the signal component.