CODEWITHSUNDEEP
reactjs
user10950305
user10950305

Reputation:

Component is declared but never used

I keep getting this weird message and React isn´t rendering my component. I am pretty sure I am rendering and importing it correctly:

Container:

import searchBar from "./searchBar";

class ItemList extends Component {

    render() {
        return (
      <searchBar/>
        );
    }
}

searchBar

import React, { Component } from 'react';

const searchBar = () => {
    return <div>ssuhsuhuhsususu</div>;
  }
export default searchBar

Upvotes: 2

Views: 5097

Answers (2)

Jitendra Kumar
Jitendra Kumar

Reputation: 2221

If you want to use component which name start with lowercase then use can use following tips:

Just assign it to capitalised variable before using it.

import searchBar from "./searchBar";
const Foo = searchBar;
<Foo/>

Full Code:

import searchBar from "./searchBar";

const Foo = searchBar;

class ItemList extends Component {

    render() {
        return (
        <Foo/>
        );
    }
}

Upvotes: 0

Anil Kumar
Anil Kumar

Reputation: 2309

Change to

const SearchBar = () => {
  return <div>ssuhsuhuhsususu</div>;
}
export default SearchBar;

I you give name in small caps it will be considered as HTML tag such as <p>, <div> So your component should always be starting with CAPS.

Upvotes: 10

Related Questions