Reactjs Redux | Can';t获取Axios响应以分派到减速器
我正在我的React本机应用程序中设置redux,并且正在努力让我的响应发送到reducer。我已经确认我得到了正确的调度响应,因此后端工作正常。我在下面贴了很多代码,因为我有点迷路了,但我的前三个问题是:Reactjs Redux | Can';t获取Axios响应以分派到减速器,reactjs,redux,axios,Reactjs,Redux,Axios,我正在我的React本机应用程序中设置redux,并且正在努力让我的响应发送到reducer。我已经确认我得到了正确的调度响应,因此后端工作正常。我在下面贴了很多代码,因为我有点迷路了,但我的前三个问题是: 我没有将我的组件正确连接到商店 我没有正确创建商店 authAction.js可能完全错了 这是我的密码: (一) 如果我没有正确连接,这是我在使用该功能的组件底部连接它的方式: export default connect(null, { signup })(ApprovedScreen)
export default connect(null, { signup })(ApprovedScreen)
2) store.js
3) authAction.js
import axios from 'axios'
import { LOG_IN } from './types'
export const signup = ({email, password}) => dispatch => {
axios.post('myapi.com/signup', {email, password})
.then(response =>dispatch({
type:LOG_IN,
payload: response.data.token
}))
.catch(error => {
console.log(error)
})
}
reducers/index.js(显然这在存储中被自动称为rootReducer)
authReducer.js
import { LOG_IN } from '../actions/types'
export const authReducer = (state = {loggedIn: null}, action) => {
switch (action.type) {
case LOG_IN:
console.log('the login reducer was activated!')
return {loggedIn: action.payload}
default:
return {...state}
}
}
从我的App.js文件
const App = createAppContainer(switchNavigator);
export default () =>{
return (
<Provider store={store}>
<App />
</Provider>
)
}
const-App=createAppContainer(switchNavigator);
导出默认值()=>{
返回(
)
}
我调用signup()的文件(Screen.js)中的一些相关代码
import React,{useState}来自“React”
从“react redux”导入{connect}
从“react native”导入{样式表、视图、文本、文本输入、图像、TouchableOpacity};
从“../../actions/authAction”导入{signup}
常量屏幕=()=>{
const[email,setEmail]=useState(“”)
const[password,setPassword]=useState(“”)
返回(
setEmail(文本)}
占位符=“电子邮件”
自动资本化=“无”
自动更正={false}
textContentType='emailAddress'
keyboardType='email-address'
/>
设置密码(文本)}
占位符=“密码”
自动资本化=“无”
textContentType='newPassword'
secureTextEntry={true}
/>
注册({电子邮件,密码})}>
创建帐户
)
}
导出默认连接(空,{signup})(屏幕)
它是否记录了这个控制台。日志(“登录还原程序被激活!”)?@Renaldo Balaj不幸的是,它没有。数据也不会发布到数据库。你能将文件发布到你调用的位置吗signup@RenaldoBalaj没问题,我只是从我调用signup的文件中发布了一些相关代码。但是你实际上在哪里调用signup函数呢?您发布的所有代码都是用于注册的导入/导出语句。它是否记录了这个console.log('login reducer已激活!')?@Renaldo Balaj不幸的是,它没有。数据也不会发布到数据库。你能将文件发布到你调用的位置吗signup@RenaldoBalaj没问题,我只是从我调用signup的文件中发布了一些相关代码。但是你实际上在哪里调用signup函数呢?您发布的所有代码都是用于注册的导入/导出语句。
import { LOG_IN } from '../actions/types'
export const authReducer = (state = {loggedIn: null}, action) => {
switch (action.type) {
case LOG_IN:
console.log('the login reducer was activated!')
return {loggedIn: action.payload}
default:
return {...state}
}
}
const App = createAppContainer(switchNavigator);
export default () =>{
return (
<Provider store={store}>
<App />
</Provider>
)
}
import React, {useState} from 'react'
import { connect } from 'react-redux'
import { StyleSheet, View, Text, TextInput, Image, TouchableOpacity } from 'react-native';
import { signup } from '../../actions/authAction'
const Screen = () => {
const [email, setEmail] = useState('')
const [password, setPassword] = useState('')
return (
<View>
<TextInput
value={email}
onChangeText={text=>setEmail(text)}
placeholder='Email'
autoCapitalize='none'
autoCorrect={false}
textContentType='emailAddress'
keyboardType='email-address'
/>
<TextInput
value={password}
onChangeText={text=>setPassword(text)}
placeholder='Password'
autoCapitalize='none'
textContentType='newPassword'
secureTextEntry={true}
/>
<TouchableOpacity style={styles.submitButton} onPress={()=>signup({email, password})}>
<Text style={styles.submitButtonText}>Create An Account</Text>
</TouchableOpacity>
</View>
)
}
export default connect(null, { signup })(Screen)