React脚手架及使用 (适用于初学者~)

首先：搭建脚手架
npx create-react-app 项目名称
        注意：以上npx，只写过vue项目的应该会认为是错别字

然后：运行 npm start 

以上创建脚手架-----------------------

《class 》写法  函数写法先绕一下  ！ 下文很多地方会跟Vue进行比较

         看我先给张图，下图颜色相同的注解表示有关联

     

此处在说一个钩子函数 常用！！！ 相当于vue 的mounted 

componentDidMount()

一、React组件通信       

        React不像Vue 父传子 props 子传父 $emit 。

        React的通信方式就是props, 由于它是单项数据流的原因，只能在父组件中操作，操作完成之后在传回给子组件。如下： 

        子组件

        SideBar 是ui框架的Tab组件，此处不要纠结

         接下来说一下大概流程：首先点击tab（onChange）也是Tab组件提供的方法，传一个事件到父组件，这里我点击的事件和传的事件叫同个名字

点击事件不喜欢绑定上列写法 下面也可：

        父组件 

        这里父组件接收事件和Vue很像  在父组件的子组件标签中绑定事件 然后从父组件操作 ，如拿传过来的值进行交互 

        但是！！ 

        交互过后log的数据改变视图不更新 这是为啥呢？？？

        Reacr这里和微信小程序有点像，如果想要更新视图 需要用到 this.setStart 微信小程序是this.setData() 

        

——以上就是简单的通讯以及一些 react 经常用到的东西