Cannot read property 'r' of null - React ES6 Project

I currently have a JSON object that holds a number of color names and hex codes within my React project and am wanting to use nearest-color to show a user the nearest color to one they have entered in a HTML input field.

handleSearch(e) {
    let color = `#${e.target.value.replace("#", "")}`;

    if (color.length == 7) {

        let tempColors = this.state.colors;
        let colorsObj = {};

        // Iterates over state and creates a JSON Object with {color-name(key): color-hex(value)}
        for (let i = 0; i < tempColors.length; i++) {
            colorsObj[tempColors[i]] = Base[tempColors[i]]
        }

        var nearestColor = require('nearest-color').from(colorsObj);
        var newColor = nearestColor(color)
        console.log(newColor)
    }
}

My code compiles, however I receive this problem in Chrome when I enter a hex code such as #ffffff:

I’ve followed the README.md, so I’m not entirely sure where my code is falling over sadly.

[hesamd]

I had the same issue. I resolved it by adding # to my hex color codes.

[Zequez]

Might be the fact that if you don’t name your colors it doesn’t return an object with the {rgb} key, and then you’re trying to read {rgb: { r }}? That happened to me 😛