Return 语句导致:期望一个赋值或函数调用,而是看到一个表达式 no-unused-expressions
Posted
技术标签:
【中文标题】Return 语句导致:期望一个赋值或函数调用,而是看到一个表达式 no-unused-expressions【英文标题】:Return statement leads to: Expected an assignment or function call and instead saw an expression no-unused-expressions 【发布时间】:2021-03-12 15:42:54 【问题描述】:我有时仍然很难理解何时或何时不使用 return 语句。我最近在我的 ReactJS 代码中遇到了一个问题。基本上,我从 fetch 调用中获取 html,然后将其设置为元素的 innerHTML。我需要在设置后稍微更改该数据。
当它不起作用时:
useEffect(()=>
setHeaderFooter(props.data.header,props.data.footer, changeLinks)
, [props.data.header,props.data.footer])
const changeLinks = ()=>
$(document).find('nav.navbar a[href*="/oc"]').each(function (index, element)
var original = $(element).attr('href');
var final = process.env.REACT_APP_PLATFORM_URL + original;
$(element).attr('href', final);
);
// Adds the first letter of the users name as the icon in header.
$('#firstLetter').text()
$('#firstLetterLink').text().charAt(0).toUpperCase()
export const setHeaderFooter=(head,foot, callback) =>
let header = document.querySelector('#header')
let footer = document.querySelector('#footer')
header.innerHTML = head, footer.innerHTML = foot
return callback()
何时生效(最后没有修改阶段):
useEffect(()=>
setHeaderFooter(props.data.header,props.data.footer)
, [props.data.header,props.data.footer])
const changeLinks = ()=>
$(document).find('nav.navbar a[href*="/oc"]').each(function (index, element)
var original = $(element).attr('href');
var final = process.env.REACT_APP_PLATFORM_URL + original;
$(element).attr('href', final);
);
// Adds the first letter of the users name as the icon in header.
$('#firstLetter').text()
$('#firstLetterLink').text().charAt(0).toUpperCase()
export const setHeaderFooter=(head,foot) =>
let header = document.querySelector('#header')
let footer = document.querySelector('#footer')
return header.innerHTML = head, footer.innerHTML = foot
谁能给我解释一下这里发生了什么。我想更好地理解 return 语句。
【问题讨论】:
【参考方案1】:问题是在header
和footer
赋值之间使用的逗号:
改变这个:
header.innerHTML = head, footer.innerHTML = foot
return callback()
到这里:
header.innerHTML = head;
footer.innerHTML = foot;
return callback();
要解释这个问题,请参阅MDN docs:
逗号运算符 (,) 计算其每个操作数(从左到右)并返回最后一个操作数的值
在您的情况下,footer.innerHTML = foot
是 最后一个操作数 并且将被返回,但是由于您没有将返回的值分配给任何东西,所以它被浪费了,因此您得到了 lint 错误。您可以在 Disallow Unused Expressions (no-unused-expressions)
【讨论】:
以上是关于Return 语句导致:期望一个赋值或函数调用,而是看到一个表达式 no-unused-expressions的主要内容,如果未能解决你的问题,请参考以下文章
期望一个赋值或函数调用,而是看到一个表达式 React JS
ReactJs - 期望一个赋值或函数调用,而是看到一个表达式