I am trying to create a firebase parent with multiple children. I looked into the documentation and I can't figure how to create many children in parallel level of my board child.
#unbind() if #unbind
#id = #uniqueId()
#dbRef = new Firebase url + "#{#id}"
#db = #$firebase #dbRef.child('board')
#db.$bind( #$scope, 'cells' ).then (unbind) =>
#unbind = unbind
This is my code so far.
tictactoe-lau
5e776bvj
board
0: value
3: value
4: value
5: value
6: value
7: value
This is the structure of my current db. I want 5e776bvj to have additional children, parallel to the board level.
Related
I have an object conf in React:
Object.keys(conf):
0: "ubicacion1"
1: "ubicacion2"
Object.values(conf):
0: "http://www.example1.es:8080"
1: "https://www.example2.es:8443"
How can I work or display each position of the Object?
Thank you
//work
conf.ubicacion1
//or
conf["ubicacion1"]
//log
console.log(conf.ubicacion1)
interface list {
name: string,
id: number,
marks: number
}
component state :
{
listOfStudents: list[],
}
now on some event, where marks is modified for a student with given name and following handler function, the following doesn't work
currentList = this.state.listOfStudents;
//find the list object with the given name
listToModify = currentList.map(item, ....=> item.name === event.name);
// update its marks
listToModify.marks = event.marks;
//set new state
this.setState({listOfStudents: currentList});
But the following works:
//get a copy of the object
currentList = [...this.state.listOfStudents];
//find the list object with the given name
listToModify = currentList.map(item, ....=> item.name === event.name);
// update its marks
listToModify.marks = event.marks;
//set new state
this.setState({listOfStudents: currentList});
I didn't have to add new data but modify an existing one, why is mutation required in such a case?
for a given state that is an object or array, react uses only its reference to compare and decide if it will update state, it doesn't do deep comparision between objects values.
the first case you are passing the same reference, therefore there is no update state. actually, if you modify the array at first example, that's actually mutating state directly.
second case you are cloning into a new fresh array, which holds a different reference. since the reference is different from previous array, react now update its state. that's actually the right approach to update state when dealing with arrays/objects.
I am trying to update my list using immutability-helper suggested in react documentation, you can see the code i am currently using for the update
const oldInstallment = this.findInstallmentByIndex(this.state.installmentList, index);
let newInstallment = {...oldInstallment}
newInstallment.isActivated = isActivated;
const newInstallmentList = update(this.state.installmentList, {index: {$set: newInstallment}});
this.setState({installmentList: newInstallmentList});
The problem i currently have is that the index is not used as a value but as a key named index meaning instead of saying 0:{$set: newInstallment} what the code does is index:{$set: newInstallment} which result in adding a new element to the array instead of updating the element in index 0
So my question is how can i tell this update method to use my index value as the key ?!
Try writing it like this:
const newInstallmentList = update(this.state.installmentList, {[index]: {$set: newInstallment}});
I'm working with DevExpress DataGrid on React.js.
According to this example, I can navigate to specific row that not visible within a specific key.
But in this example, it use the "focusedRowKey" property.
In my case, I use the "focusedRowIndex" property. My problem is that I want to navigate to specific row by index that is not visible.
Is there any "navigateToRow" function that receive index, and not key?
Or can I get the global index, like "getRowIndexByKey" (this function not good for me, if the index is outside the visible rows, it return -1).
Thanks.
Solved it by manipulating between them:
let value = null;
// eslint-disable-next-line default-case
switch (fieldType) {
case 'focusedRowIndex':
value = eventIndex;
break;
case 'focusedRowKey':
value = eventId;
break;
}
const obj = {
[fieldType]: value
};
And then, on the component itself:
<DataGrid
id='grid-container'
dataSource={events}
keyExpr='_Id'
showBorders={true}
focusedRowEnabled={true}
{...obj}
I don't get how Immutable JS List size will grown.
As in the example on official doc https://facebook.github.io/immutable-js/docs/#/List/push , pushing something in an immutable js List will automatically grown size.
In my code:
const list: List = List();
list.push(object);
console.log(list, list.size);
My output in consolle is:
(1) object
length: 1
___proto___: Array(0)
undefined
That is really different from the aspected output.
There is no size, if I use length in my code Typescript tell me that it doesn't exist "length" in List.
I use React with Typescript and Immutable.JS
Anybody has an idea of what happens?
Immutability means that operations do not change the original object but instead create a new one.
In your case the push method will return a new list with all the old elements and the new one you just added.
Your code should look something like this.
const list: List = List();
const newList = list.push(object);
console.log(list, list.size);
console.log(newlist, newlist.size);
This should print a size of 0 for the list variable and a size of 1 for the newList variable.