iT邦幫忙

0

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

  • 分享至 

  • xImage

大家好!小弟,剛學react.js,一名react.js的初學者,最近從w3c school的react.js教程的範例做練習,把範例照打上去,但我練到React Render HTML這章的範例,把程式碼照打上去後,又出現錯誤訊息和警告。
程式碼如下:
https://ithelp.ithome.com.tw/upload/images/20220123/201459928KGjwwRXB1.png
google瀏覽器上的錯誤訊息和警告(紅筆框出來部分),如下:
https://ithelp.ithome.com.tw/upload/images/20220123/20145992kTA7auUChl.png

  1. 我想請教上述錯誤訊息和警告要理會它嗎?
  2. ReactDOM.render(myelement, document.getElementById('root'));這行不行執行table嗎?
  3. 上述錯誤訊息要怎麼解決呢?
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 個回答

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

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

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

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

謝謝妳

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

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

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

謝謝妳

1
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官方文件先仔細看一遍概念會清楚很多少走很多彎路

謝謝妳

我要發表回答

立即登入回答