mez_Blog的博客

这时候会有一个认证，需要验证你的gitee用户名和密码，输入正确就可以，要是输入错误下一次还是走这个错误的认证，需要在本机去删除那个认证标识，具体方法可以度娘。然后我们将自己创建的文件copy到这个初始化的文件夹中就行，默认刚才哪些代码就生成了一个MD文件，其他啥都没有。该命令中，路径就是自己创建的json文件路径，端口也可以自定义，不要写默认其他服务的保留端口即可。在项目中，一般都放在store文件夹中，对应的模块放入modules文件夹里，对应的目录结构如下。以counterStore举例。

回到React双向绑定这里，就是在输入框输入值，然后在React调试工具中也可以看到对象的状态的值，相反，在调试工具中修改里面的值，对应输入框的值也会对应的进行修改。这个东西和vue调试工具一样，都需要去重谷歌商店中下载，不过懂的都懂，需要科学上网。classnames是一个简单的JS库，可以非常方便的通过条件动态控制class类名的显示。这时最好重启一下谷歌浏览器，否则对应的调试工具的components选项可能不会出来。这里使用了box3和box2的动态类名，我们来到对应的样式文件。

本质：和普通JS变量不同的是，状态变量一旦发生变化组件的视图UI也会跟着发生变化（数据驱动视图），可以类比与vue中的响应式。这里的e就是一个类似原生的事件e，并不是真正的原生事件e,如果要使用原生事件e，需要使用 e.nativeEvent。在React中，一个组件就是首字母大写的函数，内部存放了组件的逻辑和视图UI，渲染组件只需要把组件当成标签书写即可。概念：一个组件就是用户界面的一部分，他可以有自己的逻辑和外观，组件之间可以相互嵌套，也可以复用多次。在css文件中定义样式，然后在引入使用。

在使用vite创建react时，有一个语言选项，就是typescript-SWC，这里介绍一下SWC。SWC：可扩展的Rust的平台，用于下一代快速开发工具，SWC比Babel快20倍。简单来说，就是用于格式转换的，比Babel要快，所以在选择语言时，选择带SWC的就行，结构和不带SWC的一样。在创建的项目的入口文件中。

还有就是react和vue不一样，你要写样式的话就建立一个css文件即可，和你的tsx文件或ts文件的文件名命名一样即可，还有就是你的组件的命名一定要首字母大写，以及写类名的时候要写成className而不是class，这是因为react考虑是和class类这个关键字冲突。tsx也没啥特别的，也是ts的一种，只是ts的一个扩展后缀，多了些功能，具体区别搜一下就能知道，目前来说，对于写demo来说，你写ts后缀和tsx后缀差别不大。和当时建立vue项目一样，使用该命令创建，只是后面选择框架时选择react，