Saya Menggunakan konteks Api dengan kait useReducer di aplikasi next.js saya, yang memberikan kembali yang tidak ditentukan ketika useContext dipanggil dengan contextProvider.

Di bawah ini adalah kode saya => contextPage =>

import React, { createContext, useReducer, useContext } from 'react';
import * as types from '../constants/userConstants';

// initialized global store

export const quizContext = createContext();

// reducer

const reducer = (state, action) => {
  switch (action.type) {
    case types.USER_LOGIN_SUCCESS:
      return // user

    case types.USER_LOGOUT_SUCCESS:
      return // clear user

    default:
      return state;
  }
};

const QuizContextProvider = ({ children }) => {
  const [state, dispatch] = useReducer(reducer, {
    user: null,
  });

  return (
    <quizContext.Provider value={{ dispatch, state }}>
      {children}
    </quizContext.Provider>
  );
};

export const useQuizContext = () => useContext(QuizContextProvider);

export default QuizContextProvider;

Setelah itu, saya membungkus penyedia saya di _app.js.

Dan di halaman Login saya, saya tidak dapat mengaksesnya. Halaman masuk =>

const index = () => {
  const data = useQuizContext();
  console.log(data);
  return <div></div>;
};

Di sini, data tidak terdefinisi. Sangat macet.

1
Adiat Hasan 4 November 2020, 04:12

1 menjawab

Jawaban Terbaik

Harus

export const useQuizContext = () => useContext(quizContext)
1
Vikrant 4 November 2020, 11:16