javascript - 在我的反应应用程序上使用 selected.js

Question

我正在尝试在我的反应应用程序中使用 selected.js。然而，虽然我已经阅读了关于 refs 和 stuffs 的文档（https://reactjs.org/docs/integrating-with-other-libraries.html），但我并没有真正得到它所说的任何内容。什么是 ref 以及它到底做了什么？我有我的反应代码，但它不起作用。如果有人能解释 this ref 和 this.$el 的反应，我将不胜感激。

import React, { Component } from 'react';
import $ from 'jquery';
import { findDOMNode } from 'react-dom';

class Chosen extends Component {

    componentDidMount(){
        this.el = $(this.el);
        this.$el.chosen();
    }

    componentWillUnmount(){
        this.$el.chosen('destroy');
    }
    render() {
        return (
            <div>
                <select className="Chosen-select" ref={ el => this.el = el }>
                    { this.props.children }
                </select>
            </div>
        )
    }
}

export default Chosen;

并且，

import React from 'react';
import Chosen from './Chosen';

function Restaurants(props) {

    return (
        <Chosen className="Chosen-select" onChange={ value => console.log(value) }>
            {   
                [{name: 'h'}, {name: 'j'}, {name: 'k'}].forEach( r => {
                    <option>{ r.name }</option>
                })
            }
        </Chosen>
    );
}

export default Restaurants;

标签： javascriptjquerynode.jsreactjsjquery-chosen