在jsx中绑定js表达式以及jsx注释
生活随笔
收集整理的這篇文章主要介紹了
在jsx中绑定js表达式以及jsx注释
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>jsx語法</title>
</head>
<body>
<div id="app"></div>
<script src="node_modules/@babel/standalone/babel.js"></script>
<script src="node_modules/react/umd/react.development.js"></script>
<script src="node_modules/react-dom/umd/react-dom.development.js"></script>
<script type="text/babel">const user = {name: 'Jack',age: 18,gender: 0}// const element = (// <div>// <p>{1 + 1}</p>// <p>{'hello'}</p>// // {// // 不推薦// // 這是 jsx 和 EcmaScript 6 模板字符串混搭// }// // {/* 推薦：單行注釋 */}// {/*// * 推薦：多行注釋// * 這是 jsx 和 EcmaScript 6 模板字符串混搭// */}// <p>{`hello ${user.name}`}</p>// <p>姓名：{user.name}</p>// <p>年齡：{user.age}</p>// <p>性別：{user.gender === 0 ? '男' : '女'}</p>// </div>// )ReactDOM.render(element,document.getElementById('app'))
</script>
</body>
</html>
?
總結
以上是生活随笔為你收集整理的在jsx中绑定js表达式以及jsx注释的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： jsx基本语法
- 下一篇： 在js语法中使用jsx标签