How to use the reactive function from vue

selectic.common.js

GitHub: Intersec/selectic

204
205
206
207
208
209
210
211
212
213
        hasChanged: false,
        automaticChange: false,
        automaticClose: false,
    },
});
this.data = vue.reactive({
    labels: Object.assign({}, messages),
    itemsPerPage: 10,
    doNotUpdate: false,
    cacheItem: new Map(),

1

7

6

+ 80 other calls in file

%E7%94%9F%E6%80%81%E6%BA%90%E7%A0%81.md?plain=1

GitHub: DuSenYao/Learning-notes-and-materials

52
53
54
55
56
57
58
59
60
Vue3 的响应式是可以独立在其他平台使用的。比如可以新建 test.js，使用下面的代码在 node 环境中使用 Vue 响应。以 reactive 为例，使用 reactive 包裹 JS 对象之后，每一次对响应式对象 counter 的修改，都会执行 effect 内部注册的函数：

```js
const { watchEffect, reactive } = require('vue');

const counter = reactive({
  x: 1,
  y: 2
});

0

3

1

+ 3 other calls in file

index.js

GitHub: hacfins/vue3-multi-page

38
39
40
41
42
43
44
45
46
47

function createLoadingComponent({ options, globalLoadingOption, }) {
    let vm = null;
    let afterLeaveTimer = null;
    const afterLeaveFlag = vue.ref(false);
    const data = vue.reactive(Object.assign(Object.assign({}, options), { originalPosition: '', originalOverflow: '', visible: false }));
    function setText(text) {
        data.text = text;
    }
    function destroySelf() {

1

2

1

index.js

GitHub: hacfins/vue3-multi-page

149
150
151
152
153
154
155
156
157
158
        type: Boolean,
        default: false,
    },
},
setup(props) {
    const states = vue.reactive({
        index: -1,
        groupDisabled: false,
        visible: true,
        hitState: false,

1

2

1

index.js

GitHub: hacfins/vue3-multi-page

109
110
111
112
113
114
115
116
117
118
    }
    const prevChild = parent.steps.value[stepsCount.value - 1];
    if (prevChild)
        prevChild.calcProgress(internalStatus.value);
};
const stepItemState = vue.reactive({
    uid: vue.computed(() => currentInstance.uid),
    currentStatus,
    setIndex,
    calcProgress,

1

2

1

index.js

GitHub: infinitasx/easi-packages-antd

33
34
35
36
37
38
39
40
41
42

if (defaultData.mode === true || defaultData.mode === "dark") {
  defaultData.mode && HTML.setAttribute("data-pro-theme", "antdv-pro-theme-dark");
}

return vue.reactive({ ...defaultData,
  cachedPage: [],
  reloadPage: true,
  userInfo: {}
});

1

1

4

+ 5 other calls in file

vuex.cjs.js

GitHub: xonar21/test23

144
145
146
147
148
149
150
151
152
153
      enumerable: true // for local getters
    });
  });
});

store._state = vue.reactive({
  data: state
});

// register the newly created effect scope to the store so that we can

0

0

1

+ 21 other calls in file

index.js

GitHub: BlackToolBoxLaboratory/vue-list

145
146
147
148
149
150
151
152
153
154
emits: ["clickEntry", "toggleCollapsed", "updateLayerSize"],
setup: function (props, _a) {
    var emit = _a.emit, slots = _a.slots;
    var activeID = vue.inject("BtbVueList-activeEntryID");
    var collapsedSet = vue.reactive(new Set());
    var refList = vue.reactive({});
    var slotList = vue.computed(function () {
        return Object.keys(slots);
    });
    var clickEntry = function (entry) {

0

0

1

vue-class-component.cjs.js

GitHub: lichong21/vue-class-analysis

318
319
320
321
322
323
324
325
326
327
});

options.setup = function (props, ctx) {
  var data = new Ctor(props, ctx);
  var dataKeys = Object.keys(data);
  var plainData = vue.reactive({}); // Initialize reactive data and convert constructor `this` to a proxy

  dataKeys.forEach(function (key) {
    // Skip if the value is undefined not to make it reactive.
    // If the value has `__s`, it's a value from `setup` helper, proceed it later.

0

0

1

index.js

GitHub: BlackToolBoxLaboratory/vue-list

49
50
51
52
53
54
55
56
57
58
},
emits: ["clickEntry", "toggleCollapsed", "updateLayerSize"],
setup: function (props, _a) {
    var emit = _a.emit, slots = _a.slots;
    var activeID = vue.inject("BtbVueList-activeEntryID");
    var collapsedSet = vue.reactive(new Set());
    var refList = vue.reactive({});
    var slotList = vue.computed(function () {
        return Object.keys(slots);
    });

0

0

1

+ 3 other calls in file

vue-router.cjs.js

GitHub: chen82508/DotNetCore-WebApp

2131
2132
2133
2134
2135
2136
2137
2138
2139
2140
        default: 'page',
    },
},
useLink,
setup(props, { slots }) {
    const link = vue.reactive(useLink(props));
    const { options } = vue.inject(routerKey);
    const elClass = vue.computed(() => ({
        [getLinkClass(props.activeClass, options.linkActiveClass, 'router-link-active')]: link.isActive,
        // [getLinkClass(

0

0

1

+ 23 other calls in file

vue-meta.cjs.js

GitHub: backendprogramer/convertVueAppFromSpaToSSr

816
817
818
819
820
821
822
823
824
825
    if (isFunction(resolver)) {
        return resolver(options, contexts, active, key, pathSegments);
    }
    return resolver.resolve(options, contexts, active, key, pathSegments);
};
const active = vue.reactive({});
const mergedObject = createMergedObject(resolve, active);
// TODO: validate resolver
const manager = new MetaManager(isSSR, config, mergedObject, resolver);
return manager;

0

0

1

+ 3 other calls in file