File tree Expand file tree Collapse file tree 2 files changed +40
-9
lines changed Expand file tree Collapse file tree 2 files changed +40
-9
lines changed Original file line number Diff line number Diff line change @@ -268,9 +268,9 @@ import { provide } from 'vue'
268
268
269
269
provide (THEME_KEY , ' dark' )
270
270
271
- // or provide a reactive state
271
+ // or provide a ref
272
272
const theme = ref (' dark' )
273
- provide (THEME_KEY , computed (() => theme . value ) )
273
+ provide (THEME_KEY , theme)
274
274
275
275
// getter is also supported
276
276
provide (THEME_KEY , () => theme .value )
Original file line number Diff line number Diff line change @@ -257,22 +257,53 @@ Vue-ECharts 支持如下事件:
257
257
258
258
### Provide / Inject
259
259
260
- Vue-ECharts 为 ` theme ` 、` init-options ` 、` update-options ` 和 ` loading-options ` 提供了 provide/inject API,以通过上下文配置选项。例如:可以通过如下方式来使用 provide API 为 ` init-options ` 提供上下文配置:
260
+ Vue-ECharts 为 ` theme ` 、` init-options ` 、` update-options ` 和 ` loading-options ` 提供了 provide/inject API,以通过上下文配置选项。例如:可以通过如下方式来使用 provide API 为 ` theme ` 提供上下文配置:
261
261
262
262
<details >
263
- <summary >Vue 3 </summary >
263
+ <summary >组合式 API </summary >
264
264
265
265
``` js
266
266
import { THEME_KEY } from ' vue-echarts'
267
267
import { provide } from ' vue'
268
268
269
- // 组合式 API
270
269
provide (THEME_KEY , ' dark' )
271
270
272
- // 选项式 API
273
- {
274
- provide: {
275
- [THEME_KEY ]: ' dark'
271
+ // or provide a ref
272
+ const theme = ref (' dark' )
273
+ provide (THEME_KEY , theme)
274
+
275
+ // getter is also supported
276
+ provide (THEME_KEY , () => theme .value )
277
+ ```
278
+
279
+ </details >
280
+
281
+ <details >
282
+ <summary >选项式 API</summary >
283
+
284
+ ``` js
285
+ import { THEME_KEY } from ' vue-echarts'
286
+ import { computed } from ' vue'
287
+
288
+ export default {
289
+ {
290
+ provide: {
291
+ [THEME_KEY ]: ' dark'
292
+ }
293
+ }
294
+ }
295
+
296
+ // Or make injections reactive
297
+ export default {
298
+ data () {
299
+ return {
300
+ theme: ' dark'
301
+ }
302
+ },
303
+ provide () {
304
+ return {
305
+ [THEME_KEY ]: computed (() => this .theme )
306
+ }
276
307
}
277
308
}
278
309
```
You can’t perform that action at this time.
0 commit comments