How use method isEqual in react - reactjs

Question

I use the method _.isEqual in my function:
const Sidebar = ({ ...props }) => {
function myFunction(codeMenu) {
let menu = null;
const listMenu = props.listMenu;
for(var i = 0; i < listMenu.length; i++){
if(_.isEqual(listMenu[i].code, codeMenu)){
menu = listMenu[i];
}
break;
}
}
}
...
But I have this error:
'_' is not defined no-undef
loadsh is imported in my index.html :
https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js

Answer 1

Instead of using lodash via cdn, use it via npm. Please run following commands:
npm install lodash
and then import it in the file like
import _ from 'lodash';
and then use it. Actually more optimal way to import is:
import isEqual from 'lodash/isEqual';
so that extra lodash package might not be included in the bundle

Answer 2

One reason you may getting that error is that your React bundle is executed before lodash. In that case _ would not have been added to the global scope.
To avoid these kind of issues, I suggest ditching the CDN and instead add lodash as a dependency to your package.json file. You can then cosume lodash as a require or import.
If you import isEqual as import isEqual from 'lodash/isequal' and you're using a bundler such as Webpack, it will not bundle the other lodash functions you're not importing, dramatically reducing the amount of code your browser has to download.

Answer 3

Seems like your _ object is not defined. Did you import lodash like var _ = require('lodash'); ?

Answer 4

You need to import lodash using npm install command
Here's full code how ->
import lodash from lodash
// Load the full build.
var _ = require('lodash');
// Load the core build.
var _ = require('lodash/core');
const Sidebar = ({ ...props }) => {
function myFunction(codeMenu){
let menu = null;
const listMenu = props.listMenu;
for(var i = 0; i < listMenu.length; i++){
if(_.isEqual(listMenu[i].code, codeMenu)){
menu = listMenu[i];
}
break;
}
}