小编Mar*_*arc的帖子

我需要在 Reactrender方法中显示标题元素，其中级别在构造函数中动态设置：

class HeaderComponent extends React.Component {

    constructor(props){
        super(props);
        
        this._checkedDepth = Math.min(6, props.depth)
    }

    render(){
        return(<h{ this._checkedDepth }>{ this.props.name }</h{ this._checkedDepth }>)
    }
}

ReactDOM.render(
  <HeaderComponent name="Header 1" depth="2"/>,
  document.getElementById('app')
);

<div id="app"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

这应该<h2>Header 1</h2>用name="Header 1"and呈现depth=2，但我收到一个错误：

未捕获的错误：找不到模块“./HeaderComponent”

我在看什么？

我使用React 15.4.1，babel-preset-es2015 6.9.0，babel-preset-react 6.5.0和运行它Chrome 55。

当我在 Chrome 开发人员工具的“源”选项卡中检查我的 React 代码，并将鼠标悬停在“this.props”甚至“this”关键字上/将其添加到手表时，它显示为未定义。即使所引用的代码执行成功。很烦人……这是bug吗？有解决方法吗？

我在 Vue 应用程序中有一个 v-select 小部件（组合框/选择）。当我打开它并将鼠标悬停在选项上时，该选项的背景颜色会突出显示（当前为浅灰色）。当鼠标箭头悬停在选项上时，我希望背景颜色具有不同的颜色。我看不到支持此功能的 v-select 小部件的属性。有办法实现这一点吗？

v-select::hover {
  background-color: "#00857A";
}

<v-select
    append-icon="../assets/img/sy-arrow-chevron-down.svg"
    background-color="white"
    :height="68"
    item-text="label"
    item-value="key"
    class="mr-3"
    v-model="type"
    :width="421"
    :items="searchCriteria"
    @change="performSearch()"
  ></v-select>