我正在使用 Formik 并进行了以下设置,我希望能够在用户按下“取消”按钮时重置表单。返回表单时,所有表单值都应重置为空initialValues。
<Formik
enableReinitialize
initialValues={{
...INITIAL_FORM_STATE
}}
validationSchema={ FORM_VALIDATION }
onSubmit={handleSubmit}
>
{({ values, errors, isSubmitting, isValid, setFieldValue, handleChange, resetForm }) => (
<Form>
.....
Run Code Online (Sandbox Code Playgroud)
我有以下取消按钮的代码:
<Button
text="Cancel"
startIcon={<UndoIcon />}
variant="contained"
color="default"
className={classes.buttons}
component={Link}
to={'/home'}
onClick={() => {
{resetForm}
setMenu("Home")
}}
/>
Run Code Online (Sandbox Code Playgroud)
在表单字段中输入一些文本并按取消按钮(这会将我引导回主页)后,我返回表单并注意到我的文本仍处于表单内的状态并且没有重置。
任何人都可以帮忙解决我所缺少的东西吗?
正在开发一个涉及 React Material-UI 表的教程 atm,该表也有一个搜索输入文本字段。我试图添加的是一个按钮,该按钮将重置表报告,但也会清除搜索输入文本字段。
我遇到问题的是清除搜索文本字段。
他们将此代码用作名为 Controls.input 的单独组件库:
从 'react' 导入 React 从 '@material-ui/core' 导入 { TextField };
export default function Input(props) {
const { name, label, value,error=null, onChange, ...other } = props;
return (
<TextField
variant="outlined"
label={label}
name={name}
value={value}
onChange={onChange}
{...other}
{...(error && {error:true,helperText:error})}
/>
)
}
Run Code Online (Sandbox Code Playgroud)
主要搜索代码如下,我还添加了一个按钮
<Controls.Input
id="name"
label="Search Name"
className={classes.searchInput}
InputProps={{
startAdornment: (<InputAdornment position="start">
<Search />
</InputAdornment>)
}}
onChange={handleSearch}
/>
<Button
onClick={handleClear}
className="materialBtn"
>
Clear
</Button>
Run Code Online (Sandbox Code Playgroud)
此时,我不确定如何引用/定位搜索输入字段作为函数的一部分handleClear,以便清除其内容?
const handleClear = () => { …Run Code Online (Sandbox Code Playgroud) 我正在尝试如何使用node-postgres将逗号分隔的值字符串传递到子句查询中的postgres select中,但不幸的是似乎无法让它工作并且找不到任何示例。
我有以下代码:
function getUser() {
let inList = "'qwerty', 'qaz'";
const result = await pgPool.query("SELECT name FROM my_table WHERE info IN ($1)", [inList]);
if (result.rowCount == 1) return result.rows.map(row => row.name)
return false
}
Run Code Online (Sandbox Code Playgroud)
基本上希望处理最终结果查询:
SELECT name FROM my_table WHERE info IN ('qwerty', 'qaz')
不确定这是否真的是使用 pgPool 执行此操作的正确方法?
给定以下两个数组对象:
let origArr = [ { value: 2, label: 'Dog' },
{ value: 4, label: 'Cat' },
{ value: 16, label: 'Horse' }
]
let newArr = [
{ value: 2, label: 'Dog' },
{ value: 3, label: 'Bird' },
{ value: 0, label: 'Fish' }
]
Run Code Online (Sandbox Code Playgroud)
origArr返回仅包含和之间的差值newArr(即origArr元素不在其中)的新数组的最佳方法是什么newArr?
在上面的示例中,我正在寻找一个名为的新数组diffArr = [4,16]
请注意:和value中的所有值都是唯一的origArrnewArr
不确定是否有ES2016的意思?
javascript ×2
reactjs ×2
arrays ×1
express ×1
formik ×1
material-ui ×1
node.js ×1
postgresql ×1
use-state ×1