TypeError: Cannot read property 'Grid' of undefined thrown in Table.forceUpdateGrid - react-virtualized

I am attempting to call tableInstance.forceUpdateGrid() inside a Promise.then() callback and it is throwing an exception TypeError: Cannot read property 'Grid' of undefined
Looking at the following code
_createClass(Table, [{
key: 'forceUpdateGrid',
value: function forceUpdateGrid() {
this.Grid.forceUpdate();
}
the this reference is undefined...
the only thing I can think of is that in-between the initial BE api call and the Promise.then() handler, there has been a props change that has caused the containing component to re-render and maybe the tableInstance reference no longer points to the correct instance?
Can anyone help?

(1) Use fat arrow functions to get this reference inside function :-
_createClass(Table, [{
key: 'forceUpdateGrid',
value: forceUpdateGrid = () => {
this.Grid.forceUpdate();
}
(2)Or,
let thisRef = this;
_createClass(Table, [{
key: 'forceUpdateGrid',
value: function forceUpdateGrid() {
thisRef.Grid.forceUpdate();
}
i hope it helps!

Related

Having trouble grabbing data from MongoDB and using in new var (Next.js project)

Error I'm getting is this:
TypeError: Cannot read property 'latitude' of undefined
Here's the piece that's messing me up
const [user] = useCurrentUser();
var location = [user.latitude, user.longitude];
useCurrentUser() is here:
export function useCurrentUser() {
const { data, mutate } = useSWR('/api/user', fetcher);
const user = data?.user;
return [user, { mutate }];
}
I'm assuming I'm just calling it early, because it hasn't had a chance to go through the useCurrentUser() function yet. However, I can't for the life of me figure out how to call it when that's done?
edit:
It's also not usable later on in a component:
This works:
<span className="bold">{user ? user.latitude : ''}</span>
This doesn't:
<Map location={[user.longitude, user.latitude]}/>
What am I not understanding, hahaha

Unable to add event listener to webNavigation.onCompleted

Using the mock function below along with the dev console:
This call will work:
chrome.webNavigation.onCompleted.addListener(processWebNavChange, filtera);
but when I actually pass in my real var filter it throws this error:
Uncaught TypeError: Could not add listener
My actual data looks like this:
{
url: [ {hostContains: ".im88rmbOwZ"} ]
}
function registerWebNavListener() {
var matchers = getUrlMatchers();
var filter = {
url: matchers
};
// test with mock data filtera that actually works
const filtera = {
url:
[
{hostContains: "example.com"},
]
}
if (matchers.length > 0) {
chrome.webNavigation.onCompleted.addListener(processWebNavChange, filtera);
}
}
async function processWebNavChange(data) {
}
Is there something wrong with my data structure that I'm actually using? I don't believe that the filter object I returned is incorrect
}
EDIT:
I added a new
const filterb = {
url: [ {hostContains: ".im88rmbOwZ"} ]
};
and it still fails with that. The single entry {hostContains: ".im88rmbOwZ"}, was the first item returned from getURLMatchers() which I used as an example of real data being returned.
The above comment on the upper-case letters was the cause of the issue. Converting everything to lowercase resolved the problem.
Although, I am not clear as to why that was a problem to begin with. (If there are any hints in the chromium source code event filter handlers, I'd appreciate it if it could be pointed out).

Typescript Array.filter empty return

Problem statement
I've got problem with an object array I would like to get a sub object array from based on a object property. But via the Array.filter(lambda{}) all I get is an empty list.
The object is like:
export interface objectType1 {
someName: number;
someOtherName: string;
}
export interface ObjectType2 {
name: string;
other: string;
ObjectType1: [];
}
The method to get the subArray is:
private getSubArray(toDivied: ObjectType2[], propertyValue: string){
let list: ObjectType2[] = toDivied.filter((row:ObjectType2) => {
row.name === propertyValue
});
return list;
}
Analys
Namely two things been done ensure filter comparing works and that the data is "as expected".
Brekepoints in visual studio code
Via break points in the return and filter compareison I've inspected that the property value exists (by conditions on the break point) and that the "list" which is returned is empty.
I would like to point out that I use a Typescript linter which usally gives warning for the wrong types and undefined variable calls and such so I am quite sure it shouldn't be an syntax problem.
Tested via javascript if it works in chrome console
remove braces inside callback function
private getSubArray(toDivied: ObjectType2[], propertyValue: string){
let list: ObjectType2[] = toDivied.filter((row:ObjectType2) =>
row.name === propertyValue
);
return list;
}

Cannot read property call of undefined at Blockly.Generator.blockToCode

I am trying to add a custom text block. But when i enter any text in the input field, the error comes up.
"Uncaught TypeError: Cannot read property 'call' of undefined"
Blockly.Blocks['text_input']={
init:function()
{
this.appendDummyInput()
.appendField('Text Input:')
.appendField(new Blockly.FieldTextInput(''),'INPUT');
this.setColour(170);
this.setOutput(true);
}
};
this happens when the language definition for your custom type is missing.
// Replace "JavaScript" with the language you use.
Blockly.JavaScript['text_input'] = function(block) {
var value = Blockly.JSON.valueToCode(block, 'INPUT', Blockly.JavaScript.ORDER_NONE);
// do something useful here
var code = 'var x= "bananas"';
return code;
};

Node.js util.inspect output clarification

I know there have been many questions about this topic, but I've read through them and I'm seeing output from this function that isn't mentioned.
I'm running util.inspect on an object:
util.inspect(xyz, { showHidden: true });
And getting output like this:
{ [Function: foo]
[name]: foo,
[arguments]: bar,
[prototype]:
{ foobarize:
{ [Function: foobarize]
[length]: 99,
[name]: foobarize,
[prototype]: [Object]
},
[constructor]: foob
}
}
What command(s) would I need to run foobarize() on the object xyz?
I found the solution myself. It was to do the following:
xyz.prototype.foobarize();
Anything on an object's prototype is callable by instances.
// foo is defined
var inst_foo = new foo();
inst_foo.foobarize(); // calls foobarize() from instance
This is more object oriented than calling it from the blueprint function's (object definition) prototype.

Resources