React-Select - Replacing Components for custom option content

Question

Using React-Select (version 2) I would like to have custom designed (select) options.

The documentation suggests that Replacing Components would be a method that I could

Answer 1

Generally, you indeed want to use formatOptionLabel prop (no extra component). But in case you don't, you may override the Option component this way:

import Select, { components } from 'react-select';

const CustomOption = ({ children, ...props }) => {
  return (
    
      
      {children}
    
  );
};

function App() {
  return (
    
  );
}


Here I reuse the stock component (components.Option). This way I don't need to care about innerRef or something.

https://codesandbox.io/s/react-select-item-icon-2z3tb
    

             

                                                        
            
            

              
                
                0
              
                   
                
               讨论(0)
              
                                                  
              
              

                          
             
       
          
              
                                       

     查看其它3个回答


            
                         

                    



               
            

    发布评论: