当前位置: 首页 > 知识库问答 >
问题:

React-redux@connect不起作用,但connect()起作用

寇夜洛
2023-03-14

无法使用@connect()语法来代替export default connect()

class PhonePage extends Component { ... }

export default connect(state => ({
        testedByPhone: state.phonepage.testedByPhone
    }),
    (dispatch) => ({
        actions: bindActionCreators(testUserPhone, dispatch)
    })
)(PhonePage)

它看起来像这样:Object{screenprops:undefined,navigation:Object,testedbyphone:Object}

但是当我使用@Connect装饰器使事物更干净时,我没有得到任何在我的状态中列出的东西。

@connect(
    state => ({
        testedByPhone: state.phonepage.testedByPhone
    }), 
    { testUserPhone }
)
class PhonePage extends Component { ... }

export default PhonePage

突然之间,它不知何故实际上并不连接事物:Object{screenprops:undefined,navigation:Object}

我做错了什么,我看到每个人都在使用的神奇的@Connect装饰器的正确使用方法是什么?

其余的代码,以防万一,以@connect的形式;

'use strict'

import React, { Component } from 'react'
import {
  AppRegistry,
  StyleSheet,
  Text,
  ScrollView,
  View,
  StatusBar,
  TouchableHighlight,
  Button,
  TextInput
} from 'react-native'
import { NavigationActions } from 'react-navigation'

import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'
import { testUserPhone } from './actions'

import PhoneInput from 'react-native-phone-input'

@connect(
    state => ({
        testedByPhone: state.phonepage.testedByPhone
    }), 
    { testUserPhone }
)
class PhonePage extends Component {

    constructor(){
        super()
    }

    componentDidMount() {
        // this.props.testUserPhone
    }

    render() {
        console.log(this.props)
        return(
            ...
        )
    }
}

export default PhonePage

// export default connect(state => ({
//         testedByPhone: state.phonepage.testedByPhone
//     }),
//     (dispatch) => ({
//         actions: bindActionCreators(testUserPhone, dispatch)
//     })
// )(PhonePage)

// module.exports = PhonePage

共有1个答案

伯博
2023-03-14

@connect修饰符或一般修饰符不是JavaScript本机的。但是,您可以通过巴别塔添加它们。

你可以在这里阅读更多内容

npm install --save-dev babel-plugin-transform-decorators-legacy
 类似资料:
  • 问题内容: 我开始使用React JS开发一个Web应用程序。我从主题森林购买了一个主题。在主题中,他们在组件中使用像这样的撰写。 如您所见,导出组件时,他们的代码最后使用了compose。我无法修改其构建结构。我现在想做的是我也喜欢使用react的connect功能。 通常connect用于代替撰写。现在,如果我想使用connect来处理应用程序的状态,如何将其与compose一起使用? 问题答

  • 我用3台EC2机器创建了kafka connect集群,并在每台机器上启动了3个连接器(debezium-postgres source ),从postgres source中读取一组不同的表。在其中一台机器上,我还启动了s3 sink连接器。因此,来自postgres的已更改数据正通过源连接器(3)移动到kafka broker,S3接收器连接器使用这些消息并将它们推送到S3桶。< br >群集

  • 问题内容: 我是使用React和Redux的新手,正在构建一个简单的todos应用程序。我正在命令行中使用create-react-app工具编写应用程序。 问题 我去了其他博客和帖子,其他人提到我缺少一个npm插件来转换装饰器“ transform-decorators- legacy”,将其与Babel一起添加到我的依赖项中,但仍然收到相同的错误。 我的密码 我的依赖 package.json

  • 尝试在Ksqldb Server中嵌入Kafka连接器时,“卷”映射似乎不起作用 下面是我的docker文件 当我尝试使用连接器创建源时,我看到以下错误 { “error_code” : 500, “message” : “找不到任何实现连接器的类,并且其名称与io.debezium.connector.mysql.MySqlConnector匹配,可用的连接器是:..........}”} 我在

  • 解决方案(更新): 我认为任何操作都会导致react-redux-link调用mapState函数,但是当一个操作没有改变任何事情时,情况就不是这样了。 我有一个localStorage模块,它分派操作,但不更改状态,而是写入localStorage。该模块具有容器中使用的选择器,但在状态实际更改之前不会调用这些选择器,因此只有在调度另一个更改状态的操作后,UI才会正确显示。 问题 当我把商店放在

  • 我只是在Windows中安装jdk和jre版本8。环境变量已设置。我尝试在cmd中运行“java-version”,它显示了安装的java版本。但是当我尝试用“javac projectname”编译java项目时,系统说javac不能被识别为内部命令或外部命令。有谁能告诉我怎么修好它吗? 下面是我的环境变量: C:\users\foody>echo%路径%C:\ProgramData\Oracl