如何修复 VSCode 中的“预期表达式。ts(1109)”?

Posted

技术标签:

【中文标题】如何修复 VSCode 中的“预期表达式。ts(1109)”?【英文标题】:How do I fix "Expression expected. ts(1109)" in VSCode? 【发布时间】:2019-10-15 16:23:30 【问题描述】:

我在打开其中一个 reactjs 文件时遇到 VSCode 错误“预期表达式。ts(1009)”。 doif 以红色突出显示。 但是我可以在本地开发环境中运行代码,编译也没有问题。我猜这是由于 VSCode 编辑器错误造成的。

Atom 或 Sublime Text 等其他编辑器也可以。我在 React 中使用了三元运算来解决它,但是如果else if 太多,事情就会变得非常复杂。

<div className='form'>
    // Form stuffs
</div>

    do
      if (hasBreakfast) 
        <span>Breakfast Included</span>
       else if 
        <span>Breakfast Not Included</span>
        
    

有没有办法解决VSCode中的警告?

【问题讨论】:

您需要将该代码放入函数中。然后在 render 方法中调用它 你的代码没有任何意义 这不是有效的 JSX 语法。我不知道你为什么在它的开头有do,而且你不能在其中嵌入 if/else 语句。试试这个:&lt;div&gt;hasBreakfast &amp;&amp; &lt;span&gt;Breakfast Included&lt;/span&gt;&lt;/div&gt; 这是别人的代码。当我打开它时,VSCode 会抛出错误。 @Jayce444 有好处。三元运算符可用于解决此警告。但是如果有很多else if,就会变得复杂。事情会嵌套在三元中 好吧,如果你有复杂的逻辑,那么不要将它嵌入到你的组件中,因为你是对的,它会变得混乱且难以阅读。相反,将逻辑提取到一个函数中,然后在 JSX 中调用该函数,例如:&lt;div&gt;includedMeals()&lt;/div&gt; 【参考方案1】:
return (
  <Fragment>
  // JSX to render goes here...
  </Fragment>
);

我在最后一行收到了同样的错误。 我添加了片段元素来强制 return() 接收一个父元素。您还可以通过将返回代码包装为“div”元素来完成此操作。然而,那里的问题是你会有随机的空 'div' 。

文档解释得比我好。 https://reactjs.org/docs/fragments.html

【讨论】:

【参考方案2】:

do 在原始问题中使用的表达式实际上是“有效的”JSX/JS 语法 if you're using the babel syntax/plugin that supports the do expression proposal。 VS Code 不高兴的原因是因为TypeScript itself does not support the syntax。如果它仍然在您的开发环境中工作,again that's probably Babel。

【讨论】:

【参考方案3】:

Import Cost VSCode Extension我遇到了这个错误,刚刚卸载解决了我的问题。

【讨论】:

【参考方案4】:

在我的情况下,我使用三元条件得到了这个 Expression expected.ts(1109) 错误。

【讨论】:

【参考方案5】:

if 语句需要一个表达式来断言是否应该使用该代码块。

例如:

if (a = true) 
  // do something
 else if (b = true) 
  // do something else

如果你只想渲染Breakfast Not Included,你可以只使用else而不使用if。或者让它更简单,你可以创建一个ternary:


  hasBreakfast ? <span>Breakfast Included</span> : <span>Breakfast Not Included</span>;

【讨论】:

以上是关于如何修复 VSCode 中的“预期表达式。ts(1109)”?的主要内容,如果未能解决你的问题,请参考以下文章

修复 VSCode 中的排序键 ESLint 规则

如何让 VScode 自动修复缺少的分号 Apex?

如何修复 Typescript linting 在 VSCode 中不起作用?

我如何修复关于 vscode 中颤动的“警告:映射新 ns”

在我创建的所有新项目中,我无法修复 vscode 的 JSHint 插件中的“let”警告

VSCODE 配置eslint规则和自动修复