在 ReactJS 中获取 PHP 文件的回显

Question

我对 ReactJS 完全陌生，刚刚完成了我的教程，现在我正在使用 React。我一开始只是制作一个 PHP 文件 echo“Hello”，然后 React.js 获取该响应并将其显示在网站上，但它似乎根本不起作用。我的 PHP 代码：<?PHP  echo "Hello!";?>我的 React.js 代码：const [data, newData] = useState(null);useEffect(() => {  fetch(//MY .php file link, NOT API just a php file echoing hello)    .then((response) => response.json())    .then(newData);  });          return (    <>      <div>        { data }      </div>    </>  );

Answer 1

在第一个.then()中fetch，当您尝试使用该方法从响应中提取 JSON 内容时json()，您应该使用该.text()方法，因为您从服务器返回一个简单的字符串，而不是 JSON 对象。返回此文本后，您可以更新第二个中的状态.then()。

不要忘记在您的 中包含依赖项数组useEffect，因为如果没有它，您将始终在运行后触发另一个渲染。如果添加一个空数组作为依赖项，它将仅在页面加载时获取。

function App() {

  const [data, newData] = useState(null);

  useEffect(() => {

    fetch(URL)

      .then((response) => response.text())

      .then((response) => newData(response));

  }, []);

  return <div>{data ? data : 'No data yet...'}</div>;

}