Taro和JS笔记系列 - 思涯谷

cover-view文字显示不全：在文字后添加全角空格“　”
scrollIntoView的用法：

setScrollInto("target")
<ScrollView 
onScroll={() => setScrollInto(null)}
scrollIntoView={scrollInto}
>
<View id="target"/>
</ScrollView>

使用props值初始化状态，在props值变化时状态不会随之改变，需要使用useEffect更新状态。
使用以下代码强制刷新渲染

  const [_, update] = useState<any>();
  update(new Date());

antd部分组件不支持Webpack热更新，在webpack配置中的plugins加入browser-reload-plugin插件实现强制刷新页面。
VSCode中使用Prettier插件实现eslint自动格式化。
typeof null === 'object'
React 官方推荐将每项数据的 ID 作为组件的 key，以达到上述的优化目的。并且不推荐使用每项的索引作为 key，因为传索引作为 key 时，就会退化为不使用 key 时的代码。[1]

结论：不使用index 作为 key ，除非不涉及任何更新修改；使用 index 作为 key 会导致渲染效率的问题；使用 index 作为 key 会导致更新不符预期的问题。[2]

从react 18开始, 使用了createRoot创建应用后, 所有的更新都会自动进行批处理(也就是异步合并).使用render的应用会保持之前的行为.
jsdoc写法，必须是两个星号：

/**
@param id 目标id
@param type 类型
*/

React Native容器白屏/显示不全：给app.tsx的View设置minHeight: 100%
.then 或者 .catch 中 return 一个 error 对象并不会抛出错误，所以不会被后续的 .catch 捕获。

Promise.resolve().then(() => {
  return  ()
}).( {
  .(, res)
}).( {
  .(, err)
})

// 可渲染值
1 && <FooComponent /> // => jsx计算结果为<FooComponent />，因此渲染<FooComponent/>
"a string" && <FooComponent /> // => jsx计算结果为<FooComponent />，因此渲染<FooComponent />
0 && <FooComponent /> // => jsx计算结果为0，Renders '0'
true && <FooComponent /> // => jsx计算结果为<FooComponent />，因此渲染<FooComponent />

// 不可渲染值
false && <FooComponent /> // => jsx计算结果为false，因此什么都不渲染
null && <FooComponent /> // => jsx计算结果为null，因此什么都不渲染
undefined && <FooComponent /> // => jsx计算结果为undefined，因此什么都不渲染
{"1"} // 渲染为"1"
{0} // 渲染为0
{<FooComponent />} // 假设为正常组件，渲染为<FooComponent />

{undefined} // 不渲染
{true} // 不渲染
{false} // 不渲染
{''} // 不渲染
{null} // 不渲染