小编jun*_*lin的帖子
React：返回 JSX 的函数和函数组件有什么区别？
function renderSomething(foo) {
return <div>sth {foo}</div>
}
function Something({ foo }) {
return <div>sth {foo}</div>
}
function Component(props) {
const { foo } = props
return (
<>
{renderSomething(foo)}
<Something foo={foo} />
</>
)
}
renderSomething()和的 JSX 结果<Something />是相同的。我想知道这两种方式之间有什么区别（例如渲染方式、行为、影响等）？
render方法（即）适用于什么场景renderSomething()？我可以在里面使用挂钩吗？
推荐指数
解决办法
查看次数
TypeScript 找不到具有非相对路径“src/xxx”的模块
我遇到了解决打字稿中非相对模块的问题。并尝试等等，但它不起作用baseUrl......paths
tsconfig.json
\n\n{\n "compilerOptions": {\n "allowJs": true,\n "baseUrl": ".",\n "esModuleInterop": true,\n "module": "commonjs",\n "sourceMap": true,\n "strict": true,\n "target": "esnext",\n "typeRoots": ["node_modules/@types"]\n }\n}\n项目目录：
\n\nroot\n \xe2\x94\x9c\xe2\x94\x80src\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 APIs\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 config\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 constants\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 middlewares\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 models\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 routes\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 services\n - foo.ts \n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 utils\n \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 app.ts\n在app.ts中
\n\nimport foo from \'src/services/foo\'\n并与 一起运行ts-node src/app.ts。
但出现错误：
\n\nCannot find module \'src/services/foo\'\n推荐指数
解决办法
查看次数
Webpack URIError：无法解码参数'/%PUBLIC_URL%/favicon.ico'
webpack v4.20.2
webpack-dev-server v3.1.9
我正在使用webpack和运行React应用程序，webpack-dev-server并且遇到了有关的问题%PUBLIC_URL%。
URIError: Failed to decode param '/%PUBLIC_URL%/favicon.ico'
在%PUBLIC_URL%没有被编译的index.html，所以未能获得图标。
public / index.html
<head>
<meta charset="utf-8">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
</head>
package.json脚本
"scripts": {
"dev": "webpack-dev-server --config ./config/webpack.dev.conf.js --open",
"build": "webpack --config ./config/webpack.prod.conf.js"
},
项目结构
.
??? config
? ??? webpack.dev.conf.js
? ??? webpack.prod.conf.js
??? public
? ??? index.html
? ??? favicon.ico
? ??? manifest.json
??? src
? ??? index.js
? ...
??? …推荐指数
解决办法
查看次数
如何在React Native中布局九个正方形视图？
如何实现如下图所示的正方形布局？
或者有相关的包存在吗？
javascript flexbox reactjs react-native react-native-flexbox
推荐指数
解决办法
查看次数
git bash如何启用快速编辑模式？
（我的操作系统是Win 10）我找不到启用QuickEdit模式的选项吗？
当我单击鼠标左键选择块时，git bash复制（从win 10命令行扩展）将Ctrl + C自动执行。因此，终止过程如下图所示。我能怎么做？
PS：Ctrl-C不是我的操作，而是在释放鼠标左键单击以选择文本时自动通过终端显示
推荐指数
解决办法
查看次数
ES6 多处导入文件，为什么文件只加载一次？
如果有一个名为 的公共文件common.js，而其他文件如a.js, b.js...
常见的.js
const Common = { property: 'initial' }
export { Common };
js
import { Common } from 'common.js';
Common.property = 'changed';
js
import { Common } from 'common.js';
console.log(Common.property);
首先，a.js运行并将其加载common.js到内存中。
然后，b.js由引擎运行。
- 是否
common.js会再次加载或使用common.js内存中的现有内容？ - 如果
common.js由其他xx.js脚本更新，将如何import表现？
推荐指数
解决办法
查看次数
如何在 React Native 中收听 App 启动和关闭？
当应用程序启动和关闭时，我需要跟踪一些日志事件（仅一次）。
首先我在Homescreen 中执行此操作componentDiMount()，但在某些情况下它会被实例化多次，从而导致重复启动事件日志。
==============编辑================
AppState只能监听背景和活动事件。
在 Android 上关闭应用程序时（按返回键或在最近应用程序菜单中关闭），它实际上回到了后台。重新打开应用程序时，它会将应用程序从后台恢复为活动状态。这与在后台和活动（不关闭）之间切换应用程序相同
所以我无法确定它是首次启动还是 使用切换应用程序状态AppState
推荐指数
解决办法
查看次数
无论 yarn.lock 文件中的注册表如何，如何使用不同的纱线注册表？
我的yarn.lock文件看起来像：
package@x.x.x:
version: "x.x.x"
resolved: "http://registry.yarnpkg.com/package/-/xxxx"
但是CI在内网，注册表是http://99.12.xx.xx/xxx
无论yarn.lock文件中的 Internet 注册表如何，如何在 CI 构建中使用 Intranet 注册表？
推荐指数
解决办法
查看次数
为什么 Nginx etag 是根据上次修改时间和内容长度创建的？
etag->value.len = ngx_sprintf(etag->value.data, "\"%xT-%xO\"",
r->headers_out.last_modified_time,
r->headers_out.content_length_n)
- etag->value.data;
r->headers_out.etag = etag;
如果服务器中的文件last-modified-time发生了变化，但文件内容没有更新，那么etag值会一样吗？
为什么不是内容哈希etag生成的值？
推荐指数
解决办法
查看次数
在Web中运行的TypeScript中未定义regeneratorRuntime
我使用Vue.js + TypeScript + Parcel进行演示,并尝试async/await使用index.ts.
的index.html
<html>
...
<body>
<script src="index.ts"></script>
</body>
</html>
index.ts
console.log('Not see me')
(async () => {
console.log('Did not execute here too.')
})()
执行parcel index.html并打开http:// localhost:1234 /.控制台抛出错误:未定义regeneratorRuntime
index.a4a28941.js:110 Uncaught ReferenceError: regeneratorRuntime is not defined
at index.a4a28941.js:110
at Object.parcelRequire.306 (index.ts:3)
at newRequire (index.a4a28941.js:48)
at parcelRequire.306 (index.a4a28941.js:80)
at index.a4a28941.js:106
似乎async语法需要polyfill？
这是我的tsconfig.json:
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"baseUrl": ".",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"jsx": "preserve",
"module": …推荐指数
解决办法
查看次数
为什么Vue官方示例'markdown'在.vue文件中不起作用？
我正在使用ES6并将vue官方markdown示例迁移到.vue文件,但它不会更新计算方法中的this.input值compiledMarkdown？
结果和.vue代码在这里:
<template>
<div>
<textarea :value="input" @input="update"></textarea>
<div v-html="compiledMarkdown"></div>
</div>
</template>
<script>
import _ from 'lodash';
import marked from 'marked';
export default {
data() {
return {
input: '# hello'
};
},
computed: {
compiledMarkdown() {
return marked(this.input, { sanitize: true });
}
},
methods: {
update: _.debounce((e) => {
this.input = e.target.value;
}, 300)
}
};
</script>
<style scoped>
...
</style>我知道计算属性可以绑定数据vaule并自动更新,但为什么不在这里？
推荐指数
解决办法
查看次数
从字符串中删除多余的零
我知道从字符串中删除前导零的方法：
'000100'.replace(/^0+/, '')
但是，如果是类似浮点的字符串（例如“00100.2300”或“00100”），如何从中删除所有多余的零？
'00100.2300' => '100.23'
'00100' => '100'
'00100.0023' => '100.0023'
'100.00' => '100.' or '100' will better
'-100.002300' => '-100.0023'
'0.50' => '0.5'
假设字符串：
- 仅包含数字或点或负号“-”，不包含字符和其他字符。
- 小数点不会出现在字符串的前面。最多为一。
- 负号“-”将出现在正常位置。并且“-”前后没有多余的零。
- 字符串表示的浮点数可能大于
Number.MAX_SAFE_INTEGER - 正浮动和负浮动都是可能的。
用于过滤额外零的函数可能相对简单并且步骤也更多。
正则表达式会更简单。
推荐指数
解决办法
查看次数
反应 useRef 或模块范围来存储与 UI 无关的状态
假设currentSelected在 React 功能组件中有一个独立于UI 的状态。它存储当前选择的项目，并将在某个时间使用。
有两种方法可以在useRef hook组件外存储状态或模块范围。
useRef 钩子：
function Example() {
const currentSelected = useRef()
useEffect(() => {
// access currentSelected state
})
function handleClick(item) {
currentSelected.current = item
}
return (
<ul>
{items.map(item => <li onClick={() => handleClick(item)}>item.name</li>)}
</ul>
)
}
模块范围：
let currentSelected = null
function Example() {
useEffect(() => {
// access currentSelected state
})
function handleClick(item) {
currentSelected = item
}
return (
<ul>
{items.map(item => <li onClick={() => handleClick(item)}>item.name</li>)}
</ul>
) …推荐指数
解决办法
查看次数
标签 统计
javascript ×5
reactjs ×4
ecmascript-6 ×2
react-native ×2
typescript ×2
vue.js ×2
android ×1
bash ×1
etag ×1
flexbox ×1
git ×1
git-bash ×1
http-caching ×1
ios ×1
nginx ×1
npm ×1
parceljs ×1
react-hooks ×1
regex ×1
ts-node ×1
vuejs2 ×1
webpack ×1
webpack-4 ×1
yarnpkg ×1