欢迎访问 生活随笔!

尊龙游戏旗舰厅官网

当前位置: 尊龙游戏旗舰厅官网 > 前端技术 > vue >内容正文

vue

react usecontext-尊龙游戏旗舰厅官网

发布时间:2023/12/1 vue 19 豆豆
尊龙游戏旗舰厅官网 收集整理的这篇文章主要介绍了 react usecontext_vue3原理实战运用,我用40行代码把他装进了react做状态管理 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

前言

vue-next是vue3的源码仓库,vue3采用lerna做package的划分,而响应式能力@vue/reactivity被划分到了单独的一个package中。

如果我们想把它集成到react中,可行吗?来试一试吧。

使用示例

话不多说,先看看怎么用的解解馋吧。

// store.ts
import { reactive, computed, effect } from '@vue/reactivity';

export const state = reactive({
  count: 0,
});

const plusone = computed(() => state.count   1);

effect(() => {
  console.log('plusone changed: ', plusone);
});

const add = () => (state.count  = 1);

export const mutations = {
  // mutation
  add,
};

export const store = {
  state,
  computed: {
    plusone,
  },
};

export type store = typeof store;
// index.tsx
import { provider, usestore } from 'rxv'
import { mutations, store, store } from './store.ts'
function count() {
  const countstate = usestore((store: store) => {
    const { state, computed } = store;
    const { count } = state;
    const { plusone } = computed;

    return {
      count,
      plusone,
    };
  });

  return (
    
  • 上一篇:
  • 下一篇:
网站地图