个人技术分享

react学习——20react编写github案列

/ Content有两个属性// 1. Provider 数据提供者// 2. Consumer 数据使用者export {Provider,Consumer。

ref适用于需要频繁更改整个值的场景，因为它可以直接赋值新的数组或对象。reactive适用于需要深度响应的对象或数组，在修改其内部属性或元素时能保持响应性。不能直接赋值数组：reactive 创建的是一个深度响应的对象或数组，Vue 只跟踪创建时的对象引用。如果直接重新赋值一个新的对象或数组，Vue 将无法跟踪新的引用，因为新的引用不会被自动转换为响应式对象。

语法上来说，两者都可以实现响应式，之所以有ref和reactive，是为了更加方便的将不同的数据类型分类处理。：reactive只能声明对象/数组，ref可以响应任意数据类型，但是使用时需要加.value进行解包。解构对象时，要想保持对象的响应式，注意使用toRefs函数，否则会失去响应式。但是在使用时，reactive直接赋值非常容易丢失响应式。

这两个例子都在页面上显示“Hello, World”，但是它们的实现方式有所不同。React使用了JSX语法和组件类，而Vue使用了模板语法和Vue实例。

众所周知，Metro是默认的 JavaScript 打包模块。对于前端项目，打包工具已有webpack(大而全，图片代码打包)，rollup(专攻代码打包,框架场景常见)等，既然有这些打包工具为什么还要在移动端搞一个metro，其中一个原因为ram bundle，iOS采用读取一个文件效率更高，Android采用。

今天这篇主要讲全局Dropdown组件封装，可根据UI设计师要求自定义修改。下一篇讲【高阶渲染劫持组件封装】。关注本栏目，将实时更新。

ArcGIS官方提供了 JavaScript SDK，也提供了 ArcGIS-Runtime-SDK-iOS，但是并没有提供 React Native的版本，所以这里使用了 react-native-arcgis-mapview 库，这个库比较老，支持的 ArcGIS-Runtime-SDK-iOS 版本是100.4，但是在使用的时候发现，在使用pod install安装的时候总是会下载失败，所以后面手动将 ArcGIS-Runtime-SDK-iOS 的版本改为 100.14.1。

ref：适用于基本类型和单个对象，需要通过.value属性访问。reactive：适用于复杂对象，提供深度响应式，直接访问对象属性。结合使用：根据实际需求选择适当的API，灵活管理组件状态。理解ref和reactive的区别和应用场景，有助于在Vue 3中更高效地管理响应式状态，提升开发效率和代码可维护性。

Token作为用户的数据标识，在接口层面起到了接口权限控制的作用，也就是说后端有很多接口都需要通过查看当前请求头信息中是否含有token数据，来决定是否正常返回数据。

通过使用进行类型注解，你可以确保组件的 props 类型安全，并享受更好的开发体验，包括智能提示和自动补全。这种类型注解在团队合作和大型项目中尤其重要，因为它可以显著减少由于类型错误引起的 bug。

是一种在人工智能模型中实现交互的技术，它允许模型调用外部函数或工具来执行特定的任务。这种技术在Chat Completions API中得到了广泛应用，特别是在最新的gpt-3.5-turbo-1106模型中。通过Function Calling，模型可以生成JSON格式的输入，调用预定义的函数，从而扩展其功能和应用范围。在OpenAI的API中，Function Calling的实现方式是通过tools参数来提供的。

首先从架构层面来看，vue是MVVM架构，是一个灵活易用的渐进式双向绑定，而react并没有准确的架构模式，react准确的架构模式是调和器和渲染器，它有的是属性和状态。用属性和状态去映射视图，react，强调的是属性不可变性，单向数据流。React : 用一个函数来表示一个组件，当你把数据放进去时，它就会把数据渲染到组件里面，同时，在放数据的时候，要做到 “ 不可变 ”，也就是说，更新数据时，不是改变之前的数据，而是新生成一个和之前不一样的数据并放入函数，函数会得到一个新的UI，最后更新DOM树。

之前的 state 的值是 0，所以这就是 React 作为参数 n 传递给第一个更新函数的值。React 会保存 3 为最终结果并从 useState 中返回。通过传入一个更新函数。来更新state的值。

对象式的setState是函数式的setState方式的简写方式（语法糖）。hooks

react性能优化小妙招

React.memo是 React 的一个高阶组件，用于对函数组件进行性能优化。它通过记忆化（memoization）来避免不必要的重新渲染。当组件的 props 没有变化时，React.memo可以防止组件重新渲染，从而提高应用的性能。

注意：在实际项目中，你通常会使用构建工具（如Webpack）和打包器（如Babel）来编译和打包你的React代码，以便在浏览器中运行。首先，你需要确保已经安装了React和ReactDOM。方法将React组件渲染到DOM中的指定元素。以下是一个示例，展示如何将上述函数组件渲染到ID为。React组件可以是函数组件或类组件。在这个示例中，你需要确保你的HTML文件中有一个ID为。标签只是一个占位符，表示你应该引入编译后的构建文件。

鼠标右键点击节点时，出现“复制”功能，点击其他部位，隐藏“复制”；鼠标右键事件的文案，始终在鼠标点击位置的右下方；点击复制，提示复制成功。

理解 React 源码的 Fiber 需要对 React 的内部工作原理和性能优化有深入的了解。Fiber 是 React 16 及以后版本中引入的一种新的内部表示形式，用于在 React 的核心算法中更好地管理组件树的更新和渲染。