microsoft / microsoft/TypeScript
Support multiple properties for JSX.ElementAttributesProperty
还没有人认领这个 Issue。
- 主要语言
- Go
- 星标
- 111k
- 派生
- 14.3k
- 平均合并
- 2 天 4 小时
- 30 天内合并 PR
- 132
描述
### 🔍 Search Terms
"multiple properties", "JSX", "ElementAttributesProperty"
### ✅ Viability Checklist
- [x] This wouldn't be a breaking change in existing TypeScript/JavaScript code
- [x] This wouldn't change the runtime behavior of existing JavaScript code
- [x] This could be implemented without emitting different JS based on the types of the expressions
- [x] This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
- [x] This isn't a request to add a new utility type: https://github.com/microsoft/TypeScript/wiki/No-New-Utility-Types
- [x] This feature would agree with the rest of our Design Goals: https://github.com/Microsoft/TypeScript/wiki/TypeScript-Design-Goals
### ⭐ Suggestion
After Vue 3.6, introduce a new Vapor component (Non Virtual DOM) created by `defineVaporComponent`, it has a `props` property for JSX.ElementAttributesProperty to detect props.
```ts
const VaporComp = defineVaporComponent(() => {
props: { foo: Number },
setup: () => {
return
}
})
const instance = new VaporComp({ foo: 1 })
instance.props
// ^^^^^
```
And Vue also provide a `interop` mode, so that `Vapor Component` and `Virtual DOM Component` can be used together.
But the `Virtual DOM Component` created by `defineComponent` has a `$props` property for JSX.ElementAttributesProperty to detect props.
```ts
const VirtualComp = defineComponent({
props: { foo: Number },
setup: () => {
return () =>
}
})
const instance = new VirtualComp({ foo: 1 })
instance.$props
// ^^^^^^
```
### 📃 Motivating Example
Support `Vapor Component` and `Virtual DOM` co-usage for Vue.
Or `React Class Component` and `Vue Component` co-usage.
### 💻 Use Cases
1. What do you want to use this for?
- Supports define multiple properties for JSX.ElementAttributesProperty, so that `Vapor Component` (props) and `Virtual DOM Component` ($props) can used together.
```ts
declare global {
namespace JSX {
interface ElementAttributesProperty {
$props;
props;
}
}
}
```
2. What shortcomings exist with current approaches?
- JSX.ElementAttributesProperty now only support define one property, if defined two perpoties will be expose a error.
3. What workarounds are you using in the meantime?
- None
This is implementation details: https://github.com/zhiyuanzmj/TypeScript/commit/fcfbd3e1ea3c777b81ce6efbfb17808baafe29d5
贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
调研方向
从 TypeScript 的 JSX.ElementAttributesProperty 行为和链接的实现提交开始，然后追踪当前的单属性查找是如何进行检查的。定义在保留现有 JSX 行为的同时应如何接受 props 和 $props，并验证所提议的 Vapor 和 Virtual DOM 组件示例能够通过类型检查而不会出现当前错误。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- typescript
- 领域
- compilers
- Issue 类型
- 功能
- 难度
- 5/5
- 预计耗时
- 一周以上
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 25/100