Can't get a just created picker on React Component

Questions
1

Hi guys,

I’m trying to do something very simple and i just can’t. I create a picker on a React Component and i need to get the object of that same picker to be able to destroy it later, but i get “undefined”. I try to get it using the element id and the element itself and nothing works.

By the way, the picker works just fine.

I even created a function to get the picker object after i manually initialize it, but no luck.

Can somebody help me please?
Thanks.

My HTML (jsx as it’s a react component)

    <input type="text" placeholder="Your iOS device" readOnly="readonly" id="demo-picker-device" />
    <a onClick={this.getPicker.bind(this)}>Get Picker</a>

Code on componentDidMount()

const app = this.$f7;
const $$ = this.$$;

    var pickerDevice = app.picker.create({
      inputEl: "#demo-picker-device",
      cols: [
        {
          textAlign: "center",
          values: [
            "iPhone 4",
            "iPhone 4S",
            "iPhone 5",
            "iPhone 5S",
            "iPhone 6",
            "iPhone 6 Plus",
            "iPad 2",
            "iPad Retina",
            "iPad Air",
            "iPad mini",
          ],
        },
      ],
    });

    var element = $$("#demo-picker-device");
    console.log(element[0]);                                                  //output: the element OK
    var pickerByElement = app.picker.get(element[0]);
    console.log(pickerByElement);                                    //output:  undefined

    var pickerById = app.picker.get("#demo-picker-device");
    console.log(pickerById);                                              // output: undefined

Getting the picker function

getPicker() {
const app = this.$f7;
const $$ = this.$$;

var pickerById = app.picker.get("#demo-picker-device");
console.log(pickerById);                                                 // output:  undefined

var element = $$("#demo-picker-device");
var pickerByElement = app.picker.get(element[0]);
console.log(pickerByElement);                                       //output: undefined
2

You can’t get picker from input. Just save created instance:

var pickerDevice = app.picker.create({

change to

this.pickerDevice = app.picker.create({

And reference it later from this.pickerDevice

3

Great! that should work. Thanks! Keep up the good work.