将If语句转换为useffect hooks-ReactJs

我正在检查我的代码，我发现自从我开始使用react钩子以来，我有一些“问题”我不能说，但它不够干净。所以基本上我想澄清一下我对这个问题的看法。我想在

useffect

和

setSomething（）的内部使用
if
语句。
基本上，我想展示一条关于状态条件的信息

当前：

const [displayFeedbackMessage, setDisplayFeedbackMessage ] = useState(undefined);

useEffect(() => {

        setDisplayFeedbackMessage(
            if(displaySelectionResult && selected > 0) {
              <b>{Pluralize("document", selected, true)}</b>
              {" "}selected out of{" "}
              <b>{Pluralize("document", available, true)}</b>
              {" "}available.

        } else if (displayActionResult) {
              <b>{Pluralize("document", actioned, true)}</b>
              {" "} downloaded out of{" "}
              <b>{Pluralize("document", requested, true)}</b>
              {" "}requested.
      }
)
},[selected, displaySelectionResult, displayActionResult])


useffect（（）=>{
setDisplayFeedbackMessage(
{
显示选择结果&&
已选择>0&&
{复数（“文档”，选中，为真）}
{“”}从{“”}中选择
{复数（“文档”，可用，正确）}
{“}可用。
}
{
显示操作结果&&
{多元化（“文件”，行动，真实）}
{“”}从{“”}下载
{复数形式（“文件”，请求，正确）}
{“}请求。
}
)
}，[selected，displaySelectionResult，displayActionResult]）


返回(
{displayFeedbackMessage}
)

它工作正常，没有任何问题。但当我试着这样切换时：

期望值：

const [displayFeedbackMessage, setDisplayFeedbackMessage ] = useState(undefined);

useEffect(() => {

        setDisplayFeedbackMessage(
            if(displaySelectionResult && selected > 0) {
              <b>{Pluralize("document", selected, true)}</b>
              {" "}selected out of{" "}
              <b>{Pluralize("document", available, true)}</b>
              {" "}available.

        } else if (displayActionResult) {
              <b>{Pluralize("document", actioned, true)}</b>
              {" "} downloaded out of{" "}
              <b>{Pluralize("document", requested, true)}</b>
              {" "}requested.
      }
)
},[selected, displaySelectionResult, displayActionResult])

useffect（（）=>{
setDisplayFeedbackMessage(
如果（显示SelectionResult&&selected>0）{
{复数（“文档”，选中，为真）}
{“”}从{“”}中选择
{复数（“文档”，可用，正确）}
{“}可用。
}else if（displayActionResult）{
{多元化（“文件”，行动，真实）}
{“”}从{“”}下载
{复数形式（“文件”，请求，正确）}
{“}请求。
}
)
}，[selected，displaySelectionResult，displayActionResult]）

结论是我想减少我的
useffect
中的
jsx
表达式，但它似乎不起作用。有人能帮我一下，告诉我我做错了什么吗？
这与
useffect
挂钩无关。问题是您直接在
setState
值中创建了
if
语句

setState
需要回调，因此无法工作。您可以通过使用if语句传入回调来实现所需的结果，不过：

setState(() => {
  if (condition) {
    return something;
  }

  return somethingElse
})

这与
useffect
hook无关。问题是您直接在
setState
值中创建了
if
语句

setState
需要回调，因此无法工作。您可以通过使用if语句传入回调来实现所需的结果，不过：

setState(() => {
  if (condition) {
    return something;
  }

  return somethingElse
})

if-else
语句在JSX中不起作用。这是因为JSX只是函数调用和对象构造的语法糖？同时将条件置于
setDisplayFeedbackMessage
之外。您可能需要在这些JSX块周围使用
Fragment
，因为我不会将JSX存储在状态中，只需将所需的数据存储在状态中并根据该状态返回，这使得它更具可读性，实际上，正如上面的注释所示，您需要将JSX封装在如下片段中：{your JSX}
if-else
语句在JSX中不起作用。这是因为JSX只是函数调用和对象构造的语法糖？同时将条件置于
setDisplayFeedbackMessage
之外。您可能需要在这些JSX块周围使用
Fragment
，因为我不会将JSX存储在状态中，只需将所需的数据存储在状态中并根据该状态返回，这使得它更具可读性，实际上，正如上面的注释所示，您需要将JSX封装在如下片段中：{your JSX}实际上你是对的，我太蠢了，我错过了
return
语句。当它被添加时，它就像一个符咒。谢谢你，伙计！很高兴我能帮忙；）实际上你是对的，我太蠢了，我错过了
return
语句。当它被添加时，它就像一个符咒。谢谢你，伙计！很高兴我能帮忙；）