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

Unable to detect topSelect event from native UI component #16760

Closed
rajsuvariya opened this issue Nov 9, 2017 · 3 comments
Closed

Unable to detect topSelect event from native UI component #16760

rajsuvariya opened this issue Nov 9, 2017 · 3 comments
Labels
Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@rajsuvariya
Copy link
Contributor

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

OS:  macOS 
Node:  6.11.4
npm:  5.4.2
Watchman:  4.9.0
Android Studio:  3.0 stable

Steps to Reproduce

(Write your steps here:)

  1. from native ui component AutoCompleteTextView (android) emit event on item select listner
WritableMap event = Arguments.createMap();
event.putString("selectedText", optionList.get(position).toString());
ReactContext reactContext = (ReactContext) view.getContext();
reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
                        view.getId(),
                        "topSelect",
                        event);
  1. handle event in react native component
import PropTypes from 'prop-types';
import React from 'react'
import { requireNativeComponent, View } from 'react-native';

class AutoCompleteTextView extends React.Component {
  constructor(props) {
    super(props);
    this._onChange = this._onChange.bind(this);
    this._onSelect = this._onSelect.bind(this);
  }
  _onChange(event: Event) {
    console.log(event.nativeEvent.text, event.nativeEvent);
    if (!this.props.onTextChange) {
      return;
    }
    this.props.onTextChange(event.nativeEvent.text);
  }
  _onSelect(event: Event) {
    console.log(event.nativeEvent);
    if (!this.props.itemClickListener) {
      return;
    }
    this.props.itemClickListener(event.nativeEvent.selectedText);
  }
  render() {
    return <RCTAutoCompleteTextView {...this.props} onChange={this._onChange} onSelect={this._onSelect} />;
  }
}

AutoCompleteTextView.propTypes = {
  dataSource: PropTypes.array.isRequired,
  value: PropTypes.string.isRequired,
  onTextChange: PropTypes.func.isRequired,
  itemClickListener: PropTypes.func.isRequired,
  showDropDown: PropTypes.bool,
  showDropDownArrow: PropTypes.bool,
  hint: PropTypes.string,
  ...View.propTypes
};

var RCTAutoCompleteTextView = requireNativeComponent(`RCTAutoCompleteTextView`, AutoCompleteTextView, {
  nativeOnly: {onChange: true, onSelect: true}
});

export { AutoCompleteTextView }

  1. look at console logs

Expected Behavior

Event should be logged in console

Actual Behavior

Nothing happens in console

@stale
Copy link

stale bot commented Jan 8, 2018

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Jan 8, 2018
@stale stale bot closed this as completed Jan 15, 2018
@rajsuvariya
Copy link
Contributor Author

rajsuvariya commented Jan 15, 2018 via email

@Noitidart
Copy link

This is very sad. I wish there could be more help out here.

@facebook facebook locked as resolved and limited conversation to collaborators Jan 15, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

2 participants