我正在尝试创建一个搜索匹配列表,该列表会随着用户在其查询中键入而更新。但是,我不知道如何保持对输入元素的关注。弹出窗口总是会集中注意力。我曾尝试使用ref以编程方式设置焦点,但无法给无状态功能组件(假设这是我的TextField输入)提供了ref。
这是行为的gif。https://imgur.com/a/JVskedr
请注意,弹出窗口如何夺取焦点并阻止用户进一步输入。
<TextField
id='contact'
label='Contact Name'
className={classes.textField}
margin='normal'
ref={this.nameInput}
onChange={this.handleContactSearch.bind(this)}
value={this.state.contactSearch}
/>
<Popover
open={Boolean(anchorEl)}
anchorEl={anchorEl}
onClick={this.handlePopoverClose}
anchorOrigin={{
vertical: 'bottom',
horizontal: 'center'
}}
transformOrigin={{
vertical: 'top',
horizontal: 'center'
}}
autoFocus={false}
>
<List>{this.createContactList()}</List>
</Popover>
Run Code Online (Sandbox Code Playgroud)
这些是相关的功能:
handleContactSearch(event) {
this.handlePopoverClick(event);
this.setState({ contactSearch: handleText(event) });
this.props.filterContacts(
event.target.value,
this.props.accountInfo.AccountName
);
}
handlePopoverClick = event => {
this.setState({
anchorEl: event.currentTarget
});
};
handlePopoverClose = () => {
this.setState({
anchorEl: null
});
};
Run Code Online (Sandbox Code Playgroud)
如何使TextField元素保持焦点,以便用户可以不间断地键入其查询?
我将 momentjs 列为一个充满实用函数的 npm 包中的对等依赖项。这些函数之一使用矩。
"peerDependencies": {
"moment": "2.x.x"
},
Run Code Online (Sandbox Code Playgroud)
以下是使用 moment 的简化视图:
import moment from 'moment'
export default function formatDate(someDate) {
return moment(someDate).format('MM/DD/YYYY')
}
Run Code Online (Sandbox Code Playgroud)
我的 package.json 如下所示:
"main": "dist/index.js",
"types": "dist/index.d.ts",
"files": [
"dist"
],
"scripts": {
"build": "tsc",
"publish-free": "npm publish --access public"
},
Run Code Online (Sandbox Code Playgroud)
当我运行“npm run build”时,我在终端中收到错误消息“找不到模块‘时刻’”。
我目前正在通过使用 npm 链接将其连接到我的主项目来测试该包,我已经安装了 moment,但无法通过构建阶段。
我有一个 ios 应用程序,已从我的 Apple 开发者帐户转移到我的 client\xe2\x80\x99s 帐户(我是该帐户的团队成员)。\n使用我尝试构建的 client\xe2\x80\x99s expo 帐户该应用程序的最新版本。使用 \xe2\x80\x9cexpo fetch:ios:certs\xe2\x80\x9d,我检索了 .p8、.p12、.mobileprovision 和 .key 文件以及相关密码。
\n\n但是,当运行 \xe2\x80\x9cexpo build:ios --clear-credentials\xe2\x80\x9d 并选择提供我自己的证书时,我遇到了 .mobileprovision 文件链接到错误的开发人员帐户的问题。
\n\n因此,我在 client\xe2\x80\x99s Apple 开发人员帐户上创建了证书和配置文件,并确保配置配置文件附加了证书。然后我下载了它并再次运行 \xe2\x80\x9cexpo build:ios --clear-credentials\xe2\x80\x9d 。我使用了应用程序最初使用的相同 .p8 和 .p12 文件,但上传了新的 .mobileprovision 文件。
\n\n构建仍然失败,并显示错误:\xe2\x80\x9cvalidateProvisioningProfile:配置文件与上传的分发证书\xe2\x80\x9d 没有关联
\n\n任何见解将不胜感激。
\n我主要使用 React 并且经常发现,当我编写一个依赖于组件状态的函数时,我必须在执行任何操作之前执行检查以查看该状态是否已定义。
例如:我有一个函数,用于.map()
遍历从数据库中获取的对象数组,并为数组中的每个对象生成 jsx。这个函数是在render()
我的组件的函数中调用的。第一次render()
调用,初始数组为空。这会导致错误,因为当然,数组的第一个索引未定义。
我一直在通过进行条件检查以查看数组的值是否未定义来规避这一点。每次编写 if 语句的过程都感觉有点笨拙,我想知道是否有更好的方法来执行此检查或完全避免它的方法。
我正在尝试将一个Firebase项目的存储桶中的文件夹内容复制到另一个Firebase项目的存储桶中。
这两个项目都对他人的服务帐户具有必要的权限。
这是我所做的:
当尝试使用云外壳终端将文件从Project-A的默认存储桶中的文件夹传输到Project-B的默认存储桶时,我首先将项目设置为“ Project-A”。然后我跑了gcloud beta firestore export gs://[PROJECT_A_ID] --collection-ids=[FOLDER_TO_TRANSFER] --async
。这将成功并在Project-A中创建一个名为“ 2019-08-26T21:23:23_26014 /”的文件夹。此文件夹包含一些元数据。接下来,我尝试通过将项目设置为Project-B并运行来开始导入。gcloud beta firestore import gs://[PROJECT_A_ID]/2019-08-26T21:23:23_26014
此操作完成,日志显示以下消息:
done: true
metadata:
'@type': type.googleapis.com/google.firestore.admin.v1beta1.ImportDocumentsMetadata
collectionIds:
- [FOLDER_TO_TRANSFER]
endTime: '2019-08-26T21:25:56.794588Z'
inputUriPrefix: gs://[PROJECT_A_ID]/2019-08-26T21:23:23_26014
operationState: SUCCESSFUL
startTime: '2019-08-26T21:25:19.689430Z'
name: projects/[PROJECT_B]/databases/(default)/operations/[SOME_ID_STRING]
response:
'@type': type.googleapis.com/google.protobuf.Empty
但是,Project-B存储桶没有任何新文件或文件夹。看起来导入什么也没做。我想念什么吗?
javascript ×3
reactjs ×2
css ×1
expo ×1
firebase ×1
ios ×1
material-ui ×1
node.js ×1
npm ×1
react-native ×1
typescript ×1