React.js 練習w3c的react.js教程的React Render HTML的範例遇到問題

react.js

帥帥大阿湯 2022-01-23 00:46:31 ‧ 1320 瀏覽

分享至

大家好!小弟，剛學react.js，一名react.js的初學者，最近從w3c school的react.js教程的範例做練習，把範例照打上去，但我練到React Render HTML這章的範例，把程式碼照打上去後，又出現錯誤訊息和警告。
程式碼如下:

google瀏覽器上的錯誤訊息和警告(紅筆框出來部分)，如下:

我想請教上述錯誤訊息和警告要理會它嗎?
ReactDOM.render(myelement, document.getElementById('root'));這行不行執行table嗎?
上述錯誤訊息要怎麼解決呢?

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

2 個回答

iT邦好手 1 級 ‧ 2022-01-23 18:22:03

把所有要使用 React render 的東西都掛到單一個 Node 上試試看（不要使用兩次 ReactDOM.render()）。

至於警告訊息我覺得暫時不用理會。

回應 4
分享
檢舉

看更多先前的回應...收起先前的回應...

帥帥大阿湯 iT邦新手 4 級 ‧ 2022-01-24 12:06:35 檢舉

謝謝妳

帥帥大阿湯 iT邦新手 4 級 ‧ 2022-01-24 12:08:04 檢舉

不好意思，react.js一定要用node.js嗎?不能使用cdn嗎?

EN iT邦好手 1 級 ‧ 2022-01-24 12:37:53 檢舉

阿湯
可以直接使用 cdn 沒問題，等你熟悉基本語法以後再改用 webpack 開發小專案吧～

帥帥大阿湯 iT邦新手 4 級 ‧ 2022-05-03 10:50:20 檢舉

謝謝妳

登入發表回應

woodwind

iT邦新手 5 級 ‧ 2022-01-25 00:14:39

錯誤訊息是html的提示, table的結構要放在、裡面參考下面範例

<table>
    <thead>
        <tr>
            <th>Table header</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Table body</td>
        </tr>
    </tbody>
</table>

react是javascript的library, 他可以跑在任何能執行javascript的地方也就是browser至於為什麼要node.js是因為JSX語法要透過bable翻譯然後webpack去打包(build)成最後的js檔,這個JS檔就可以放在cdn然後用script tag放在網頁上
建議可以先把react官方文件先仔細看一遍概念會清楚很多少走很多彎路