Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Kendo Calendar produces an error - Unknown props debug, reactive on <div> tag. #17

Open
Hiroki111 opened this issue Dec 12, 2016 · 3 comments

Comments

@Hiroki111
Copy link

Hiroki111 commented Dec 12, 2016

I've been trying to use the Kendo UI's Calendar in the following way.

import {Calendar as KendoCalendar} from "react-kendo";
//es6

render() {
   //other lines here
  return (
      <div style={styles.divider}>
           <KendoCalendar style={styles.fullwidth} />
      </div>
  );
}

This ends up getting an error - Unknown props debug, reactive on

tag in vendor js.
There is no such a tag as "debug" or "reactive" anywhere in my js files (as well as in html/php files). If I remove the '' tag, the error disappears.
Could I have any advice?

@Hiroki111
Copy link
Author

Also, this error comes with another error - Uncaught TypeError: React.findDOMNode is not a function

As far as I understand, findDOMNode function was introduced from React v15.0.
So, I'm wondering whether I need to avoid using React v15, meaning that I may well use an older version.

Has anyone tried it with v15?

@froatsnook
Copy link
Contributor

The debug+reactive come from defaultProps. #15 fixes this problem.

findDOMNode has been around for a while, but it moved from react to react-dom. The fix that will work in v15 but maintain compatibility with older versions is to use refs.

KendoWidgetMixin.js:
    /**
     * Initialize Kendo component
     */
    componentDidMount: function () {
      if (this.props.debug) console.log('kendo widget mounting... ', widget);

-     this.elem = React.findDOMNode(this);
+     this.elem = this.refs.elem;
      this.$elem = $(this.elem);
      this.$widget = mountKendoWidget(this, widget);

      if (this.props.debug) console.log('kendo widget mounted:', widget, ', widget=', this.$widget);
      if (this.props.debug) console.log('elem=', this.elem);
      if (this.props.debug) console.log('$elem=', this.$elem);
    },

    /**
     * Default Kendo widget renderer
     */
    render: function () {
      var other = _.omit(this.props, [ 'options', 'children', 'tag' ]);
+     other.ref = "elem";
      return React.DOM[this.props.tag](other, this.props.children);
    }

froatsnook added a commit to froatsnook/react-kendo that referenced this issue Jan 30, 2017
@spacecowboyian
Copy link

Publish to NPM please.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants