Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of how to use shallowReactive in Vue3.0 API, the content is detailed and easy to understand, the operation is simple and fast, and has a certain reference value. I believe you will gain something after reading this Vue3.0 API article on how to use shallowReactive. Let's take a look at it.

ShallowReactive

Create a responsive agent that tracks the responsiveness of its own property, but does not perform deep responsive transformations of nested objects (exposing the original values).

Import {shallowReactive, isReactive} from "vue"

Const state = shallowReactive ({

Foo: 1

Nested: {

Bar: 2

}

})

/ / changing the nature of state itself is responsive

State.foo++

/ /... But do not convert nested objects

Console.log (isReactive (state.nested)) / / false

State.nested.bar++ / / non-responsive

Unlike reactive, any property that uses ref is not automatically unpackaged by the agent.

ShallowReadonly

Create a proxy that makes its own property read-only, but does not perform a deep read-only conversion of nested objects (exposing the original value).

Import {shallowReadonly, isReadonly} from "vue"

Const state = shallowReadonly ({

Foo: 1

Nested: {

Bar: 2

}

})

/ / change the property of state itself will fail

State.foo++

Console.log (isReadonly (state))

/ /... Can be applied to nested objects

Console.log (isReadonly (state.nested)) / / false

State.nested.bar++ / / applicable

Unlike readonly, any property that uses ref is not automatically unpackaged by the agent.

This is the end of the article on "how to use shallowReactive in Vue3.0 API". Thank you for reading! I believe you all have a certain understanding of "how to use shallowReactive in Vue3.0 API". If you want to learn more, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.