两者的优缺点比较这里就不列了，没啥子意义。
仅从个人主观的观察，Vue 的视频教程数量要远远多于 React 相关。
两者在视觉上最大的区别应该就是有没有将结构行为样式相分离，但注意，这些仅仅是视觉上给人的感受，实际上 template 中写的东西也是要交给 render 函数去处理的。而这也是很多人争论的点。
React embraces the fact that rendering logic is inherently coupled with other UI logic: how events are handled, how the state changes over time, and how the data is prepared for display.
趁着 Vue3 的间隙来看一波 React，学的东西类似，如何插值，如何响应式，如何组件化。
- Vue | 入手 Vue
- Vue | 插值操作 | 如何将数据弄到DOM中
- Vue | 插值操作 | 如何将数据插入到元素属性上
- Vue | 两对cp
- Vue | 一对基友
- Vue | v-model && form
- Vue | 组件化 | 基本操作
- Vue | 组件化 | 组件通信
- Vue | 组件化 | 组件个性化
React 没有类似 v-if 指令的东西，那么列表遍历渲染逻辑就不同了。
同样 React 没有采用 mustache 语法，那么如何将数据和 DOM 搞到一起也是个问题。
React 推荐使用的是 JSX，这货和 TypeScript 与 JavaScript 的关系类似，最终还是要搞成 JavaScript 代码，至于这个过程是怎样的就涉及到编译原理的知识了。
不得不说前端的方言是真多。
JavaScript ===> TypeScript JSX
CSS ===> stylus less sass
HTML ===> markdown
DOM ===> VDOM
来看一波场景
// 如何将数据弄到DOM中
<h1>{{title}}</h1>
const element = <h1>{title}</h1>
// 如何将数据插入到元素属性上
<img :src=user.avatarUrl />
const element = <img src={user.avatarUrl} />
组件方面，Vue更多地使用单文件格式，而React可以使用函数组件和class组件，且组件名要大写开头。
function Welcome(props) {
return <h1>Hello, {props.name}</h1>
}
好吧，上面就是一个函数组件了，它和普通普通函数相比，在于 return 的地方，其实是 return 了一个对象。当然了，也可以使用类组件，要继承 React.Component，更多地使用函数组件。
class Welcome extends React.Component {
render() {
return <h1>Hello, {this.props.name}</h1>;
}
}
那么，接下来如何将 props 值传给组件？
// Vue
<Welcome :name=name></Welcome>
// React
const element = <Welcome name={name} />;
接下来是生命周期，和Vue使用上没啥区别，名字不同。
接下来是事件处理，都是要编写处理函数的。
// vue
<button @click="activateLasers">
</button>
// react
<button onClick={activateLasers}>
Activate Lasers
</button>
紧接着是条件渲染，在 Vue 中会使用 v-if 指令，而在 React 中使用 JSX 可以根据值return不同的组件。就按照 JavaScript 的逻辑来看就好。忽然有点想投入 React 的怀抱了。
// react
function Greeting(props) {
const isLoggedIn = props.isLoggedIn;
if (isLoggedIn) {
return <UserGreeting />;
}
return <GuestGreeting />;
}
下面是列表渲染，在Vue中使用v-for,前面提到过 React 没有指令这一套，还是使用JSX。
const numbers = [1, 2, 3, 4, 5];
const listItems = numbers.map((number) =>
<li>{number}</li>
);
ReactDOM.render(
<ul>{listItems}</ul>,
document.getElementById('root')
);
当然了，你不用map也可以，foriin也不拦着，能遍历就完事了。这里也有key的概念，和Vue中的key类似。
