Maison >interface Web >js tutoriel >Comment se moquer des données en réaction

Comment se moquer des données en réaction

coldplay.xixi
coldplay.xixioriginal
2020-12-03 17:05:556162parcourir

Méthode React mock data : créez d'abord le fichier [/api/headerList.json] dans le répertoire public ; puis ajoutez le code approprié [axios.get('/api/headerList.json')].

Comment se moquer des données en réaction

L'environnement d'exploitation de ce tutoriel : système Windows7, version React17, ordinateur thinkpad t480.

Méthode de données simulées React :

Le code suivant appelle la méthode getList() lorsque l'entrée obtient le focus.

const mapDispathToProps = (dispatch) => {
    return {
        handleInputFocus() {
            dispatch(actionCreators.getList())
        }
    }
}

La méthode getList() obtient des données via Ajax Pour le moment, le backend n'a pas encore été écrit, donc je me moque moi-même des données.

export const getList = () => {
    return (dispatch) => {
        axios.get('/api/headerList.json').then((res) => {
            const data = res.data;
            console.log(data)
        }).catch(() => {
            console.log('error')
        })
    }
}

axios.get('/api/headerList.json')Avec ce code, l'ordinateur ira d'abord dans le répertoire src pour chercher /api/headerList.json s'il n'est pas trouvé, il ira ensuite dans le répertoire public pour chercher. À ce stade, nous allons créer /api/headerList dans le fichier .json du répertoire public, le fichier est le suivant :

{
    "success":true,
    "data":["微信","支付宝","蚂蚁金服","被骗","借呗","诈骗","盗窃","pandas","TensorFlow","PyTorch","Caffe","scikit-learn","Python","Keras","pyecharts","ggplot","Matplotlib","Gensim","Bokeh","Theano","Scrapy","SciPy","Plotly","NumPy","XGBoost","是","他","有","光大永明","我","要","人","Android","女","大","不","着","男","它","二","于","中","java","把","上","这","下","的","了","来"]
}

Les données renvoyées à ce moment sont les données ci-dessus et les données imprimées. via console.log(res.data) est comme indiqué ci-dessous :

Comment se moquer des données en réaction

De cette façon, les données fictives ont fonctionné.

Recommandations d'apprentissage gratuites associées : javascript(vidéo)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn