Comments (5)
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
from react-trello.
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 });
from react-trello.
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...
from react-trello.
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.
from react-trello.
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.
from react-trello.
Related Issues (20)
- Cannot read properties of null (reading 'trySubscribe') cause he above error occurred in the <Connect(BoardContainer)> component HOT 6
- react-trello-ts is now released :)
- LaneHelper.js:53 Uncaught TypeError: Cannot read properties of undefined (reading 'find')
- Dark mode
- Inner HTML in JSON
- Needs to be draggable by dragging on the body like trello.
- Broken on react 17 and 18
- Programmatically scroll within <Board> on a button click
- Bug when using hook react?
- Bug react hook useState, useEffect?
- How to listen for attribute updates on a Card? HOT 1
- Add treshold to infinite scroll
- Unable to try react-trello in a NextJS project HOT 1
- Drag-n-drop does not work correct in Firefox 119.0.1 (64-bit) Ubuntu
- Getting console warnings and errors with using the latest react-trello in my react app HOT 3
- Pass all "PickedProps" to all lane related Custom Components other than LaneHeader
- Plans for a headless version?
- index.js:1 Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. HOT 1
- Warning when Card description is a JSX element
- Dependency warning when using React 17
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-trello.