使用流星从mongo获取数据

时间:2015-12-05 16:37:10

标签: meteor reactjs

我刚开始使用Meteor / React进行项目。

在我的" Customer.jsx"

Customer = React.createClass({
        propTypes: {
            //customer: React.PropTypes.object.isRequired
        },
        getInitialState: function () {
            return { customers: [] };
        },
        mixins: [ReactMeteorData],
        deleteThisCustomer(){
            Meteor.call("removeCustomer", this.props.customer._id);
        },
        getMeteorData() {
            let query = {};
            //query = {checked: {$ne: true}};
            return {
                customers: Customers.find(query, {sort: {createdAt: -1}}).fetch()
            };
        },
        handleSubmit(event) {
            event.preventDefault();

            // Find the text field via the React ref
            var data = {};
            data['first_name']= ReactDOM.findDOMNode(this.refs.customerFirstName).value.trim();
            data['last_name'] = ReactDOM.findDOMNode(this.refs.customerFirstName).value.trim();

            console.log(data);
            Meteor.call("addCustomer", data);

            // Clear form
            ReactDOM.findDOMNode(this.refs.customerFirstName).value = "";
            ReactDOM.findDOMNode(this.refs.customerLastName).value = "";
        },
        renderCustomers() {
            return this.data.customers.map((customer) => {

                return <Customer
                    key={customer._id}
                    customer={customer.first_name}
                    />

            });
        },
        singleCustomer(){
            return(
                <li className="customerClassName">
                    <button className="delete" onClick={this.deleteThisCustomer}>
                        &times;
                    </button>

                    <label>Here{ this.props.customer }</label>
                </li>
            );
        },
        render() {
            return (
                <div className="container">
                    <header>
                        <h1>Add new Customer</h1>
                        <form role="form" className="form-inline" onSubmit={this.handleSubmit} >
                            <div className="form-group">
                                <label>First Name</label>
                                <input type="text" className="form-control" ref="customerFirstName" placeholder="First Name." />
                            </div>
                            <div className="form-group">
                                <label>Last Name</label>
                                <input type="text" className="form-control" ref="customerLastName" placeholder="Last Name." />
                            </div>
                            <button type="submit" className="btn btn-default">Add Customer</button>
                        </form>
                    </header>

                    <ul>
                        {this.singleCustomer()}
                    </ul>
                </div>
            );
        }
    });

每次尝试添加first_name或last_name时,我都会遇到各种错误。事实上我认为我的render()的整个顺序和结构都是一场噩梦。

有什么想法吗?

任何帮助都将不胜感激。

提前致谢:)

0 个答案:

没有答案