其實(shí)就是this.props.setting.component是一個(gè)由父組件傳下來(lái)的組件

//這是一個(gè)函數(shù)
function f(a, b){
  return a + b;
}

f(1, 2) // 3

// 這是一個(gè)接受函數(shù)的函數(shù)：
function f(fn, a, b){
  return fn(a, b);
}

var add = function (a, b) { return a + b;}
f(add, 2, 3); // 5

組件是一回事：

//這是一個(gè)組件
class A extends React.Component {
  render() {
    return <div>{this.props.hello}</div>
  }
}

// <A hello="hi"></A>  
// render =>
// <div>hi</div>

//寫一個(gè)接受組件為 props 的組件
class B extends React.Component {
  render () {
    var c = this.props.component;
    // 和 vue 不同的是，組件并不需要注冊(cè)，組件名只要是當(dāng)前作用域下可用的變量就行
    // 所以直接 <this.props.component></this.props.component> 也是可以的
    // 因?yàn)?jsx 翻譯后就是 createElement(component, props, children)
    return <c {...this.props}></c>
  }
}

// <B component={A} hello="what's up!"></B>
// render =>
// <div>what's up/div>

其實(shí)這個(gè)例子用高階組件更合適的。