Array.Some cannot read properties of null - javascript

I'm trying to figure out why I'm getting this Type Error: TypeError: Cannot read properties of null (reading 'toString')
The error is coming from this method:
private search = (rows: Array<any>) => {
const columns = rows[0] && Object.keys(rows[0])
return rows.filter((row) =>
columns.some((column : any) => row[column].toString().toLowerCase().indexOf(this.state.queryText.toLowerCase()) > -1)
)
}
I'm just not sure whats causing it or even how to fix it.

This error occurs because an element of the row variable (line 4) is null, so null.toString() is not defined. You could fix this issue with another value check:
columns.some((column : any) => row[column] && row[column].toString().toLowerCase().indexOf(this.state.queryText.toLowerCase()) > -1)

Related

React app crashing when trying to read total property

I am trying to figure out how to solve this issue where the app is crashing when trying to read the 'total' property. The problem is that the issue is not happening when I am viewing in development. But when I deploy to Heroku, it happens. Any idea what it could be?
const determineDefaultQuote = () => {
const exchangeInternalAccount = holdingsByAccount.find(account => account.exchange === 'EXCHANGE');
const usdcBalance = exchangeInternalAccount && exchangeInternalAccount.assets.find(item => item.name === 'USD').freeTotal;
const usdtBalance = exchangeInternalAccount && exchangeInternalAccount.assets.find(item => item.name === 'SHIB').freeTotal;
if (usdBalance > shibBalance) return 'USD';
return 'SHIB';
};
The error I am seeing is:
main.d3a0d78b.js:1 uncaught at q TypeError: Cannot read properties of undefined (reading 'freeTotal')

TypeError: null is not an object (evaluating 'arr.push')

Almost a similar question was asked earlier but I could't figure it out in my case so here it is (I'm using react-native and expo):
I was using chrome to see the result of my codes for a to-do app and it was working well until I wanted to try it in my phone that I faced this once the "addTodo" function was called:
TypeError: null is not an object (evaluating 'arr.push')
this is the code:
addTodo = () => {
var newTodo = this.state.text;
var arr = this.state.todo;
if (!newTodo) {
alert("Empty!");
} else {
arr.push(newTodo);
this.setState({ todo: arr, text: "" });
this.setDataLocally();
}
"text" contains the string coming from the input and will be added to "todo" array.
as you can see the "arr.push" should only be called when "newTodo" is not null or empty.
I only get the error when I want to use the Asyncstorage. this is the what should be called at the end of above code:
setDataLocally = () => {
var jsonData = JSON.stringify(this.state.todo);
AsyncStorage.setItem("list", jsonData);
What should I do? thanks in advance!
The problem is that your variable is null .. but it expects a list.
Try this:
addTodo = () => {
var newTodo = this.state.text;
var arr = this.state.todo !== null ? this.state.todo : [];
if (!newTodo) {
alert("Empty!");
} else {
arr.push(newTodo);
this.setState({ todo: arr, text: "" });
this.setDataLocally();
}

Error: cannot read property push of undefined when using .push on an empty array that is stored in an object

When a user clicks "save" I need to collect all the data from inputs with a class of input_product and compile it to data with this format:
data = {param1:[{upc:'upc', value:'value'}, ... ], ... paramN: [ ... ]}
I tried doing this with the code below, but I keep getting this error:
Uncaught TypeError: Cannot read property 'push' of undefined
$('.save').on('click', function() {
event.preventDefault();
var data = {};
$('.input_product').each(function() {
const
param = $(this).attr('name'),
upc = $(this).parent().parent().attr('id'),
value = $(this).val()
console.log(param, upc, value); //prints qty, 1001, 5
if (value && param) {
if (!param in data) {
data[param] = [];
}
data[param].push({'upc':upc, 'value':value}); // Error is thrown here
}
});
window.someFunction(data);
});
What am I missing here?
The in operator has lower precedence than the ! operator. You need to add brackets around param in data; change
if(!param in data)
to
if(!(param in data))
Currently, what you are doing is converting the value of param to a boolean, negating that, and then checking if the result of that negation exists as a key in the object data (i.e., what you are writing is equivalent to if((!param) in data)) , when instead you want to check if param exists as a key in data and then negate the result of that to execute some code if param does not exist as a key in data. As a result, you are never setting the value of the key param in data, so it stays at undefined and you get the Uncaught TypeError: Cannot read property 'push' of undefined.
See Operator Precedence.
Try this:
$('.save').on('click', function() {
event.preventDefault();
var data = {};
$('.input_product').each(function() {
const
param = $(this).attr('name'),
upc = $(this).parent().parent().attr('id'),
value = $(this).val()
console.log(param, upc, value);
if (value && param) {
if (!(param in data)) {//added brackets
data[param] = [];
}
data[param].push({'upc':upc, 'value':value});
}
});
window.someFunction(data);
});
Working JSFiddle Demo: https://jsfiddle.net/n6bg3da8/

Uncaught Error: invalid keyPath in immutable js?

I am just creating a function to update existing value from my state with immutable js even though the code look fine to me it throws invalid KeyPath Err
const initialState = fromJS({
all:[],
tags:[],
isPaginationData:true,
isContactFetchingPagination:false
});
.....
const findAndUpdateContact = (state,action) => {
let {payload} = action;
let findIndex = state.get('all').findIndex(i => i._id === payload._id);
if(findIndex !== -1){
console.log(typeof findIndex,findIndex);// Returns number , 0
console.log(state.deleteIn(['all',findIndex]),"New State"); // not deleting throws an error
return state
}else {
return state
}
};
....
You can use setIn to update your data once you have found the index you want to update.
I would first find the index (as you did):
let findIndex = state.get('all').findIndex(i => i.get('_id') === payload._id);
and then update the state with:
return state.setIn(['all', findIndex], 'new state');

JavaScript Cannot read property 'id' of null

here is my code below..
onRowSelection(event, selectedRule) {
if(event.node && this.props.selectedRule.id !== null){
if ( event.node.selected && !this.props.selectedRule ||
event.node.data.id !== this.props.selectedRule.id) {
this.props.getRule(event.node.data.id);
this.setSelectedRow(event.node.data.id)
}
}
}
I'm receiving an error when i select the row.
Uncaught TypeError: Cannot read property 'id' of null
try following
onRowSelection(event, selectedRule) {
// add checking whether this.props.selectedRule is null or not
if(event.node && this.props.selectedRule !== null && this.props.selectedRule.id !== null){
if ( event.node.selected && !this.props.selectedRule ||
event.node.data.id !== this.props.selectedRule.id) {
this.props.getRule(event.node.data.id);
this.setSelectedRow(event.node.data.id)
}
}
}
Even though this will bypass your error, this wont solve your problem, You need to check why this.props.selectedRule coming null at this point.
onRowSelection(event, selectedRule)
selectedRule isn't used as it is within the body of your function.
My suggestion (based on the few line code you posted) is to use selectedRule where you're using this.props.selectedRule
Thanks
i write the if condition like this
onRowSelection(event) {
if(event.node && event.node.data){
if ( event.node.selected && !this.props.selectedRule){
this.props.getRule(event.node.data.id);
this.setSelectedRow(event.node.data.id)
}
if(this.props.selectedRule){
if ( event.node.data.id !== this.props.selectedRule.id) {
this.props.getRule(event.node.data.id);
this.setSelectedRow(event.node.data.id)
}
}
}
}
it seems working now.

Categories