Question

我正在创建高阶组件，以将一些道具与另一个组件一起传递。但是收到有关“未知事件处理程序”属性的警告。

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  tags$head(
    tags$script(src = "jquery-ui/jquery-ui.min.js"),
    tags$script("$(function() {
                    $('#works').draggable();
                })")
  ),
  actionButton("add","Add layer"),
  div(class="aux"),
  div(id="works",style="width:300px;height:200px;background:red"))

server <- function(input, output, session) {

  observeEvent(input$add,{
    insertUI(
      selector = ".aux",
      where="afterEnd",
      ui = div(id=paste0("new",input$add), style="width:300px;height:200px;background:blue"),
      immediate = TRUE
    )
    runjs("$('#new1').draggable();")
  })

}

shinyApp(ui, server)

事件有效，但是我在chrome devTool中遇到错误（即警告：未知事件处理程序属性export class TableHeaderRow extends React.PureComponent{ render() { const customCell = WrappedCellComponent(Cell,this.props.onHeaderClick, this.props.isMasterChecked, this.props.onTableCheckBoxselection); return ( <TableHeaderRowBase cellComponent={customCell} rowComponent={Row} contentComponent={Content} titleComponent={Title} showSortingControls={true} sortLabelComponent={this.props.sortLabelComponent} groupButtonComponent={(data: any) : any => null} showGroupingControls={false} {...this.props} /> ) } } const WrappedCellComponent = (WrappedComponent, onHeaderClick,checkIfMasterChecked, onTableCheckBoxSelection) => { class HOC extends React.Component { render() { return <WrappedComponent {...this.props} onHeaderClick={onHeaderClick} onTableCheckBoxSelection={onTableCheckBoxSelection} checkIfMasterChecked={checkIfMasterChecked} />; } } return HOC; };。它将被忽略。）

Answer 1

当您传递名称以on开头的道具（无论大小写）时，这基本上会发生。 React假设并尝试将其与诸如onClick，onKeypress等的javascript事件绑定

Answer 2

error有据可查：

如果您尝试呈现DOM，则会触发unknown-prop警告带有道具的元素，该道具未被React识别为合法DOM 属性/属性。您应该确保您的DOM元素不周围有乱七八糟的道具。

警告：未知的事件处理程序属性`onHeaderClick`。它将被忽略

2 个答案: