Updating board data does not re-render the board?

[sluongng]

Hi, I am currently having board data as a prop boardData: {lanes: []} in constructor() and then I try to fetch the lanes in componentDidMount(). My problem is that even after fetching successfully and this.state.boardData were updated, the board is still rendering with {lanes: []}

Is it not possible to render the board dynamically right now?

[rcdexta]

You have to pass the board data as data prop. Check out this example repo as a reference to use this library: https://github.com/rcdexta/react-trello-example

[sluongng]

I used that exact example to start out @rcdexta
But I noticed that you are using json file instead of fetching json data from another webservice so I am trying that

so I have

constructor(props) {
        super(props);

        this.state = {
            isLoading: false,
            boardData: {
                lanes: []
            }
        }
    }

boardData here will be modified by

async componentWillMount() {
        this.setState({isLoading: true});

        try {
            const reponse = await this.getBoard();

            console.log("DEBUG This is premount results: " + reponse);

            this.setState({ boardData: reponse });
        }
        catch (e) { alert(e); }

        console.log("DEBUG This is list after mount: " + this.state.boardData);

        this.setState({isLoading: false});
    }

    getBoard() {
        const response = invokeBackend({path: '/testservice/cards', method: 'GET'});

        return response;
    }

What I dont understand here is for the life of me the board is empty after state is newly set by this.setState({ boardData: reponse });

[rcdexta]

I created a story to simulate this scenario and actually found a glitch in state management that was causing this issue. Thanks for bringing this up!

The new behaviour that you are expecting is documented here: https://github.com/rcdexta/react-trello/blob/master/stories/AsyncLoad.story.js

Pls try the latest build and revert back if it works for you...

[sluongng]

Yup I digged up the code and found whats wrong and fixed it with another loading-state alternating the render process. Not entirely sure why directly updating data didnt work but current workaround gave me better idea for implementation my board.

Closing.

[mohaimenmahi]

Is there any way of updating the board data into DB like MongoDB or other NoSQL? I mean when I will dnd a card from one lane to another, I have to update the whole card in the state as well as in DB.