Question

我有这个validate函数组件，如何使用它返回回调函数？

仅用于检查有效性的第一个文件

export function checkValidity(value, rules, shouldValidat) {
   let isValid = true;

    return isValid;
}

第二个文件调用者

import { checkValidity } from "../UI/CheckValidity";
let res = checkValidity(vlaue, validationRules, shouldValidat);

callback = () =>{
   alert("call back function is done");
}

如何使用react js从第一个文件调用回调函数？

Answer 1

您需要在checkValidity函数中有一个回调。

因此，您需要在callback中添加checkValidity(value, rules, shouldValidat, callback)作为参数，然后只需执行以下操作：

export function checkValidity(value, rules, shouldValidat, callback) {
   let isValid = true;
   /*do your validation here and if it's okay then call callback*/
   callback();
   return isValid;
}

Answer 2

您应该编写一个类似;的函数；

callback(email) {
const re = ..... => it should be validation rule 
if(re.test) {
return email;
}
return false;

，当您在其他函数中调用函数时，应该给您的电子邮件或其他param参数作为param。

Answer 3

两个回调示例：

为真时进行回调callback(isValid)

回调以处理错误（如果需要）errorcallback(isValid)

export const checkValidity = (value, rules, shouldValidate, callback, errorcallback) => {
    let isValid = true; // hardcoded
    isValid ? callback(isValid) : errorcallback(isValid)
    return isValid;
}

如何调用

将函数用作参数4和5，在这种情况下为callback和errorcallback

val表示从回调传递回的参数。在上面的示例中，传递了isValid，现在我们从调用val的地方调用checkValidity()。

import { checkValidity } from "../UI/CheckValidity";
let res = checkValidity(value, validationRules, shouldValidate);

checkValidity(
    value,
    rules,
    shouldValidate,
    (val) => {console.log('callback() if true!! ' + val )},
    (val) => {console.log('errorcallback() if false!!' + val}
)

我如何使用reactjs回调函数

3 个答案: