Свойства React HOC DOM вызывают «Неизвестное свойство обработчика событий» - PullRequest
Новая
       32

Свойства React HOC DOM вызывают «Неизвестное свойство обработчика событий»

0 голосов
/ 04 мая 2018

Я только что сделал HOC с перекомпоновкой, но по какой-то причине все пропущенные реквизиты вызывают предупреждение React. 

Warning: Unknown event handler property `onSaveChanges`. It will be ignored.

И все мои свойства, которые имеют одинаковый синтаксис (начиная с нижнего регистра, а затем верхнего регистра: lowerUpper). Конечно, если я напишу это полностью в нижнем регистре, то это не вызовет никаких предупреждений, НО я должен написать все свои реквизиты в нижнем регистре, если я использую HOC с перекомпоновкой?

Мой HOC: 

import React from 'react'

import { withStateHandlers, withHandlers, withState, compose } from 'recompose'

const editableCell = (defaults) => 
    compose(
        withStateHandlers(
            { isEditing: false, value: ''},
            {
                toggleEditing: ({ isEditing, inputValue }) => defaultValue => ({
                    isEditing: true,
                    inputValue: isEditing ? inputValue : defaultValue
                }),
                onChange: () => event => ({
                    inputValue: event.target.value
                }),
                deactiveCell: () => () => ({
                    isEditing: false
                })
            }
        ),
        withHandlers({
            handleSave: ({
                isEditing,
                inputValue,
                onSaveChanges,
                deactiveCell,
            }) => event => {
                event.preventDefault()
                //can validate before save...
                deactiveCell()
                return onSaveChanges(isEditing, inputValue) 
            }
        })
    )

export default editableCell

В основном ВСЕ мое свойство вызывает это предупреждение (либо функция, либо просто простой примитив, в основном что-нибудь [isEditing, inputValue, onChange, deactivateCell, onSaveChanges, handleSave ... и т. Д.)

Как мне решить эту ошибку? Это действительно раздражает.

1 Ответ

0 голосов
/ 06 мая 2018

Проблема не связана с перекомпоновкой. Согласно Реактивный документ :

Предупреждение о неизвестном подпорке сработает, если вы попытаетесь отобразить DOM элемент с опорой, который не распознается React как законный DOM атрибут / свойства. Вы должны убедиться, что ваши элементы DOM не есть ложные опоры, плавающие вокруг.

Вы должны передавать только действительные реквизиты элементу DOM. Например:

Не 

function MyDiv(props) {
  return <div {...props} />
}

У 

function MyDiv({ onSaveChanges, inputValue, /** other invalid props **/, ...otherProps}) {
  return <div {...otherProps} />
}

В The React Doc .

есть и другие примеры.
...