Skip to content

Commit 872a351

Browse files
committed
docs: note about custom properties in devtools
1 parent fd901cd commit 872a351

File tree

1 file changed

+12
-1
lines changed

1 file changed

+12
-1
lines changed

docs/core-concepts/plugins.md

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ You can add properties to every store by simply returning an object of them in a
5353
pinia.use(() => ({ hello: 'world' }))
5454
```
5555

56-
You can also set the property directly on the `store`:
56+
You can also set the property directly on the `store` but **if possible use the return version so they can be automatically tracked by devtools**:
5757

5858
```js
5959
pinia.use(({ store }) => {
@@ -108,6 +108,17 @@ pinia.use(({ store }) => {
108108
})
109109
```
110110

111+
Any property _returned_ by a plugin will be automatically tracked by devtools so in order to make `hasError` visible in devtools, make sure to add it to `store._customProperties` **in dev mode only** if you want to debug it in devtools:
112+
113+
```js
114+
// from the example above
115+
pinia.use(({ store }) => {
116+
store.$state.secret = globalSecret
117+
store.secret = globalSecret
118+
store._customProperties.add('secret')
119+
})
120+
```
121+
111122
:::warning
112123
If you are using **Vue 2**, Pinia is subject to the [same reactivity caveats](https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats) as Vue. You will need to use `set` from `@vue/composition-api`:
113124

0 commit comments

Comments
 (0)