qq_43260366的博客

/ 将虚拟dom渲染到dom元素上语法：ReacDOM.render(虚拟dom,要渲染的dom节点)；// 注意同一dom节点仅能渲染一个虚拟dom,多次使用render函数渲染到同一dom上将会被覆盖；// jsx中虚拟dom可以被识别，注意不要加引号否则将直接作为字符串被处理。表示标签间使用的是jsx语法并且需要使用babel进行编译;1.在使用CDN链接进行开发时需要引入3个链接，作用如下；2.script标签上存在一个type属性，引入顺序：必须先引入核心库再引入扩展库。

react脚手架能够帮助我们快速创建一个基于。创建项目之后，默认会有如下四个命令运行项目。

通过上述例子可以看出。

【代码】react笔记_03对比虚拟dom与真实dom。

总结成一句话：能够返回一个值的叫做js表达式举例说明举例说明className。

若是第一个参数为函数：当调用setState函数时，react会自动调用该函数，并将当前state与props传入，因此在该函数中是可以获取当前实例对象的state 与props的。这是因为setState更新数据是异步的，若是想要在通过setState修改数据后，立即拿到修改后的数据，可以使用setState的第二个参数。添加之后就会将该dom以键值队的形式添加到refs对象中。react的三大属性其实是实例化对象的三大属性，由于函数组件是没有实例化的，因此将这三大属性称为类组件的三大属性。

在react开发中， 大部分数据需要使用state存储，更改时使用setState去修改。默认情况下，在通过setState去修改数据时会重新渲染整个组件树，若是在某次setState更改数据时不想要重新渲染，可以在生命周期钩子中做判断。在该生命周期函数中，若是返回值为true表示重新渲染，若是返回值为false表示不重新渲染(即使数据改变了)默认若是在组件中没有显示声明该生命周期，默认情况下会重新渲染整个dom树。声明。

以前我们称函数组件为简单组件，因为函数组件是无状态的(没有state)。而在React 16.8版本增加了 Hook，它可以让你在不编写 class 组件的情况下，也就是我们可以在函数组件中使用 state 以及其他的 React 特性。Hook 不能在 class 组件中使用 —— 这使得你不使用 class 也能使用 React。通过useState函数初始化数据。

总结-> 对于props的值类组件 展示的是修改后的值；函数组件 展示的是修改前的值；

使用行内方式进行事件绑定，在事件被触发时是直接调用，因此方法内的this指向为Window;在使用关键字或方法进行事件绑定，在事件被触发时是通过dom元素调用，因此方法内部的this指向为dom元素。

在注册路由时如下：可能有两个甚至多个的路由注册,通过 下面代码 注册路由 当path变为/home时 路由出口的位置展示哪个组件-- Home组件orTest组件or两个都展示？以上是注册的几个路由，但是一进入页面时，匹配不到任何的路由，此时若是我们想进入页面(url为空)时默认展示home组件的内容，可以使用路由重定向。在App.vue(跟组件)注册了 Home路由和About路由，在Home组件注册了 Sun1和Sun2 两个子路由。以下就注册了一个 Home 组件 ，组件路径为/home。

Redux 是 JavaScript 状态容器，提供可预测化的状态管理 --> 是一个专门做状态管理的js库。redux并不是react的插件库 --> Redux 除了和 React 一起用外，还支持其它界面库(如angular, vue 等)。它体小精悍（只有2KB–包括依赖）。

组件，React在渲染时会自动将 FragMent组件给清除掉，类似vue中的 template标签。所以在不需要dom元素，但是又由于某些语法要求时，我们就可以使用空标签或Fragment组件。但是有的时候我们不想最外层包裹标签，或者是其他地方必须包裹标签但是这样会造成添加多余的dom。其实不使用Fragment组件，使用空标签，在渲染时，react也会将其移除掉。上述代码在渲染时只有一个div元素，但是呢空标签 不适用于便利元素。存在key属性 用于遍历时添加key值！

在html中 input标签的value属性为 当前表单元素的值。

虽然此时显示的是横向柱状图，但是数据的排列顺序是从下往上排列，看起来与我们设置的数据顺序是相反的（因为设置爹第一个数据是衬衫，总觉得此时第一个应该是衬衫，但是实际衬衫在最下面）在柱状图中是分为x轴与y轴的，默认情况下x轴表示类目的y轴表示数量，但是若是我们需要 横向柱状图如下，那应该如何配置呢？全量引入指的是引入了echarts的核心模块、全部图表以及图表所能用到的组件。若想x轴与y轴对调，仅需将xAxis与yAxis的type属性值对调即可，如下。若是你的项目仅仅是使用1个或少数图表，建议使用按需引入。

Anchor组件 用于包裹Link组件affix 是否固定为固定模式， 默认为固定模式若是固定模式(true) :Anchor组件在滑动到当前组件之前是静态定位，滑动到当前组件之后为固定定位(固定在可视窗口的最顶端)若是非固定模式(false):Anchor组件一直都为静态定位(不脱标)举例说明 -> 案例1targetOffset:锚点滚动偏移量,默认为0若是设置偏移量：对应元素不是滑动到当前元素的最顶端而是最顶端下移对应偏移量举例说明-> 案例2。