Question

我有一个小型内部库，想为将要使用JSX的用户创建智能感知。

基本上，我希望用户开始书写并具有需要在自动完成功能中添加的可用属性。

type脚本具有允许其显示智能感知的接口和模型。我正在寻找相同的东西（即使我需要付出一些努力）

我正在使用es6和最新的vs代码。

该代码并不是真正相关的代码（可以是任何反应代码），但是在这里是为了防止有人给我指导/修改。

代码示例：

class Button extends React.Component{
    constructor(props){
    super(props);
  }
  handleClick = () => {
    this.props.onClickFunction(this.props.IncrementValue);
  }
    render(){
    return (
        <button onClick={this.handleClick}>{this.props.IncrementValue}</button>
    )
  }
}
const Result = (props) => {
    return (
    <div>{props.counter}</div>
  );
};
class App extends React.Component{
    state = {counter: 0};

  incrementCounter = (IncrementValue) => {
    this.setState((prevState)=>({
        counter: prevState.counter + IncrementValue
    }));
  };

    render(){
    return(
        <div>
          <Button IncrementValue={1} onClickFunction={this.incrementCounter} />
        <Button IncrementValue={5} onClickFunction={this.incrementCounter} />
          <Button IncrementValue={10} onClickFunction={this.incrementCounter} />
          <Button IncrementValue={100} onClickFunction={this.incrementCounter} />
        <Result counter={this.state.counter} />
        </div>
    )
  }

}

ReactDOM.render(<App />, mountNode);

Answer 1

打开您的VS代码workspace settings，然后在settings.json中添加以下内容。

{
  "files.associations": {
    "*.js": "javascriptreact"
  },
  "editor.formatOnSave": true
}

这将使VS Code可以使用react特定的配置/自动完成功能来处理React项目下的每个js / jsx文件。这还将启用保存时的默认代码格式。

希望这会有所帮助！

vs代码-带有es6的自定义jsx智能

1 个答案: