Question

有没有一种方法可以创建对象并在整个类中使用它。不在状态中，因为现在我有一个问题，我需要初始化一个对象类（cookie），并且需要从内部访存方法中对其进行引用。换句话说，如何创建对象并将其传递给状态或使其在整个类中可用。我知道我缺少一些基本知识，但是我在阅读了教程，文章，问题之后发布了问题，并且如果问题似乎很基础，我也找不到解决这一问题的方法。我将提供一些代码来向您展示我的尝试。顺便说一句，如果有人可以向我展示一些可供阅读的资源，因为我不是第一次遇到这个问题，而我却错过了一些东西，例如，我想要在Java中实现的任务很容易，您可以在代码的开头声明变量及其完成。谢谢您的提前帮助。

import Cookies from 'universal-cookie';

class Home extends React.Component {


    constructor(props) {
        super(props);
        const { cookies } = new Cookies();             <-- I want to pass this object into state.
        this.state = {
            veichles: [],
            filteredItems: [],
            user: {},
            query: '',
            password: '',
            welcome: '',
            welcomeMsg: '',
            token: '',
        };

    }

    handleChange = e => {
        this.setState({query: e.target.value})
    }

    handlePassword = e => {
        this.setState({password: e.target.value})
    }

    onSubmit = e => {
        e.preventDefault();
        fetch(  `myresource/customer/auth/${this.state.query}/${this.state.password}`,
            {
                method: "POST",
                headers: {
                    credentials: "same-origin"
                },
                credentials: "include",
            })
            .then(res => res.json())
            .then((result) => {
                    this.setState({
                        user: result,
                        password: result                         <-- state
                    });
                    cookies.set('token', result, { path: '/' }); <-- i want to use it here or in the state above
                }
            )

        this.setState( { welcomeMsg: 'Hello, ' } );
    }

    render() {
        const { filteredItems } = this.state;
        return (
            <Container>
                <Row>
                    <Col sm={12} >
                        <form className={style.form1}>
                             <input  content="Username" type="text" onChange={this.handleChange} />
                             <input type="password"  onChange={this.handlePassword} />
                             <button className={style.button}  onClick={this.onSubmit}>Login</button>
                        </form>
                    </Col>
                </Row>
                <Row>
                    <Col sm={12}> <Jumbotron {...this.state} /> </Col>
                </Row>
            </Container>
        );
    }
}


export default Home

Answer 1

在构造函数内执行this.cookies = cookies。然后，您应该能够在正确的类this.cookies上下文存在的任何地方访问this。您可以在当前尝试访问的地方使用它。

有没有办法在React.js中使对象在整个范围内可用

1 个答案: