@chnwillliu #3 有道理，后面试试

@chnwillliu #5 确实不想嵌套的...

@b821025551b #4 有的，仅仅是 / 不能访问，/xxx 都行

@SKYNE #1 刚刚看了 getenforce 是 Permissive

#28 说的正是我的问题所在，使用 reactive 也确实解决了。我之前的代码也是可以运行的，但是太嗦了，reactive 使得响应式不用加 value ，直接解构简洁了不少，看起来舒服多了。
那个解决问题就好了，能交流是好事，不要吵架

@johnkiller 看你的例子应该是解决了我的问题的，现在在车上，等下试试。
vue3 刚开始用，看别人的教程一直用 ref ，说是可以通过编译器提示响应式变量，没怎么用过 reactive 。

@xiaojie668329 嗯嗯，前几楼上了。
前端是野路子出生，没习惯这种在线 demo ，上面有个老哥给了我提醒，前端这种确实方便。

@daiwenzh5 #15 感谢每一个愿意给出答复的人，我应该直接上 demo 的，谢罪！

@johnkiller #11 非常感谢你的 demo ，看了你的例子，我发现可能是我描述的不够准确，我希望的是在组件中传递一个 value ，而不是一个 ref ，因此在解构后就丢失了响应式，如：
https://codesandbox.io/s/vue3-jsx-demo-vcjpmo?file=/src/components/Demo1.vue
正如 demo1 ，所有的行为是符合预期的，但是当 hooks 里面返回的 props 存在多个时，手动设置就太麻烦了，所以我希望的时如 demo2 、demo3 那样，在组件中直接解构 props ，但是在这种情况下，响应式就丢失了，我不知道怎么处理更好一点。

具体的代码如下：
```vue
<script>
// demo1
import { defineComponent, ref, computed } from "vue";

function useCounter() {
const number = ref(0);
const count = computed(() => number.value + 1);
return {
// count 是一个 ref
count,
number,
};
}
export default defineComponent({
setup() {
const { count, number } = useCounter();

return () => {
// 传递 count 为 value
return <Display count={count.value} number={number} />;
};
},
});

function Display(props) {
return (
<div>
<button OnClick={() => props.number.value++}>inc</button>
<div>{props.count}</div>
</div>
);
}
</script>

```vue
<script>
// demo2
import { defineComponent, ref, computed } from "vue";

function useCounter() {
const number = ref(0);
const count = computed(() => number.value + 1);
return {
// count 是一个 ref
count,
number,
};
}
export default defineComponent({
setup() {
const counter = useCounter();

return () => {
// 解构 count 为 ref
return <Display {...counter} />;
};
},
});

function Display(props) {
return (
<div>
<button OnClick={() => props.number.value++}>inc</button>
<div>{props.count}</div>
</div>
);
}
</script>
```
```vue
<script>
// demo3
import { defineComponent, ref, computed } from "vue";

function useCounter() {
const number = ref(0);
const count = computed(() => number.value + 1);
return {
// count 是一个 value
count: count.value,
number,
};
}
export default defineComponent({
setup() {
const counter = useCounter();

return () => {
// 解构 count 是一个 value
return <Display {...counter} />;
};
},
});

function Display(props) {
return (
<div>
<button OnClick={() => props.number.value++}>inc</button>
<div>{props.count}</div>
</div>
);
}
</script>

@lalalaqwer #2
```ts
// 额， 我上面是顺序写反了，只是例举它的值
export const someprops = {
one: getOne.value,
}

```

@suzic #3 toRefs 之后所有的属性都是 ref ，解构后就不对了，实际上需要 ref.value 的值

@shakukansp #1 对啊，one 只是 someprops 的一个属性，所以才需要解构啊

@oneisall8955 #13 额，实际上对于单个入参异常是无所谓，但是对于批量的情况下，我是想要知道那些数据是正确的，哪些是错误的，此时异常的话就终止了，目前看来，好像是只有用 String, Interge 这种原始类型，去映射枚举的 name ，或者 code 比较好一点，用反射动态写入枚举值，感觉挺怪的。
这个问题是最近在做 Excel 导入时想到的，想做成一个通用的自动校验。

@mossrock #15 这种的我考虑过，但是需要在枚举中手动设置一个“未知”枚举项了，如果做团队通用设计的话，通过人工约束也不太好，枚举又不能自定义抽象类，所以我在描述中也说了，测试了反射动态添加 UNKNOWN 枚举值。

@tairan2006 #14 NotNull 只是非空校验，如果允许为空呢？可以不填，但是填了必须在可选范围内的这种

@oneisall8955 不是序列化的问题， 而是同时使用枚举入参，并且注解校验，目前我了解的是无法做到的，因为序列化在前，没有的值，就成了 null

@oneisall8955 用原始值感觉不够优雅，正是如此才会想要讨论一下

@sulinwork 这样用校验器就没法区分出非预取值了，因为匹配不上的就被转成 null 了

vscode 内置 git ，以及 git history ，集成度已经很高了