How to use "state" to change data on " createContainer()" in React?

help
1

Could I use “state” to change data on " createContainer()"?

import { Meteor } from 'meteor/meteor';
import { Lists } from '../../api/lists/lists.js';
import { createContainer } from 'meteor/react-meteor-data';
import ListsShow from '../pages/ListsShow.jsx';

export default createContainer(({ params }) => {
  const { id } = ......// state change
  ......
  return {
    .......
  };
}, ListsShow);

// Have state change event
......
export default class ListsShow extends React.Component {
.............
2

Could you elaborate on what you mean?

Especially on the line:

const { id } = ......// state change
3

Thanks for your reply.
I would to get data from createContainer with state change like tracker-component enter link description here

import React from 'react';
import Tracker from 'tracker-component';
import "/imports/models";

class Cars extends Tracker.Component {
  constructor(props) {
    super(props);
    this.state = {
      brand: this.props.brand
    };
    this.autorun(() => {
      this.subscribe( 'models', this.state.brand );
    });
    this.autorun(() => {
      this.setState({
        ready: this.subscriptionsReady(),
        cars: Models.find({ brand: this.state.brand }).fetch()
      });
    });
  }

  handleChange() {
    this.setState({brand: this.refs.brand.value});
  }

  render() {
    let {cars = []} = this.state;
    let selectBrand = this.handleChange.bind(this);
    let brands = ["Volvo", "Tesla", "DeLorean"];

    return (
      <div>
        <select ref="brand" onChange={selectBrand} defaultValue={this.state.selected}>
          {brands.map((brand, i) =>
            <option value={brand} key={i}>{brand}</option>
          )}
        </select>
        <ul className={["cars",
          this.state.ready ? "ready" : ""].join(' ')}>
          {cars.map((car, i) =>
            <li className="car" key={i}>{`${car.brand} ${car.model}`}</li>
          )}
        </ul>
      </div>
    );
  }
}
Cars.propTypes = {
  brand: React.PropTypes.string
};
Cars.defaultProps = { brand: 'Volvo' };

export default Cars;
4

I need the same thing, how should we change the subscription params with createContainer?

5

Similar conversation - may help: Can this.state be accessed in createContainer function?

6

If using FlowRouter, you could use queryparams:

export default createContainer( () => {
  const recordId = FlowRouter.getParam('recordId');
  ......
  return {
   record:  RecordCollection.findOne({_id:recordId})
  };
}, ListsShow);
1 Like
7

If you are using Redux, you have to make sure createContainer wraps a component connected to the Redux store. Then you can access state through the props you mapped in mapStateToProps.

1 Like
8

I think we could use reactivevar for this but I didn’t try it yet anyone did?