Как исправить «Ожидается выражение. ts(1109)» в VSCode?
Я столкнулся с ошибкой VSCode «Ожидается выражение. ts (1009)» при открытии одного из файлов reactjs. do и if были выделены красным цветом.
Но я могу запускать код в своей локальной среде разработки, а также без проблем компилировать. Я думаю, это связано с ошибкой редактора 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?
и ваш код не имеет никакого смысла
Это недопустимый синтаксис JSX. Я не знаю, почему у вас есть do в начале, и вы не можете вставлять в него операторы if/else. Попробуйте это вместо этого: <div>{hasBreakfast && <span>Breakfast Included</span>}</div>
Это из чужого кода. VSCode выдает ошибку, когда я его открываю. @ Jayce444 имеет хороший смысл. Для устранения этого предупреждения можно использовать тернарный оператор. Но будет сложно, если их много else if. Вещи будут вложены в тройку
Что ж, если у вас сложная логика, то НЕ встраивайте ее в свой компонент, потому что вы правы, она станет запутанной и трудной для чтения. Вместо этого вытяните логику в функцию, а затем просто вызовите функцию в своем JSX, например: <div>{includedMeals()}</div>
Ответы 5
Оператору if требуется выражение, чтобы утверждать, следует ли использовать этот блок кода.
бывший:
if (a = true) {
// do something
} else if (b = true) {
// do something else
}
Если вы просто хотите отобразить Breakfast Not Included, вы можете просто использовать else без if. Или сделайте это проще, вы можете сделать троичный:
{
hasBreakfast ? <span>Breakfast Included</span> : <span>Breakfast Not Included</span>;
}
В моем случае я получаю эту ошибку Expression expected.ts(1109), используя троичное условие.
return (
<Fragment>
// JSX to render goes here...
</Fragment>
);
Я получил ту же ошибку в последней строке. Я добавил элемент фрагмента, чтобы заставить return() получить один родительский элемент. Вы также можете сделать это, заключив код возврата в элемент div. Однако проблема в том, что у вас будут случайные пустые «div».
Документы объясняют это лучше, чем я могу. https://reactjs.org/docs/fragments.html
do выражения, используемые в исходном вопросе, на самом деле являются «действительным» синтаксисом JSX/JS если вы используете синтаксис/плагин babel, который поддерживает предложение выражения do. Причина, по которой VS Code недовольна, заключается в том, что Сам TypeScript не поддерживает синтаксис. Если он все равно работает в вашей среде разработки, опять же это наверное Вавилон.
Стоимость импорта расширения VSCode столкнулся с этой ошибкой для меня, просто удалил, исправила мою проблему.
Вам нужно поместить этот код в функцию. затем вызовите его в методе рендеринга