Giter Site home page Giter Site logo

Comments (7)

rjfernandes avatar rjfernandes commented on August 27, 2024 5

same issue, it's flickering when opened, I think it's opening 3-4 popups on top of each other

-edit- this is just a guess but I think it's caused when the MonthPicker.android.js calling RNMonthPickerDialogModule.open(), this function gets called every time the react native component with the picker element rerenders, the android picker component doesn't track whether there's already a picker component open or not.

You can use useMemo hook to avoid this issue:

return useMemo(() => visible && <MonthPicker {...props} />, [visible])

It works like a charm =)

from react-native-month-year-picker.

vprecopeviivo avatar vprecopeviivo commented on August 27, 2024 2

I came across this issue as well on Android.
What we had was this MonthPicker component wrapped in a react "View" and we were using a boolean state flag to drive the display of the MonthPicker.

example of our code:
...
let [show, setShow] = useState(false);
...

let onValueChange = (event, newDate) => {
    //NOTE (IMPORTANT!!!):
    //do not move this setShow state call. This MUST be at the top of the method otherwise the MonthPicker will break when used on Android
    setShow(false);  

    //only the ACTION_DATE_SET one will have a valid "newDate" value
    if (newDate != null && newDate != undefined)
    {
      //do something here and set monthPickerSelectedDate to the date value
    }
    // if we use setShow(false); here after we set the "monthPickerSelectedDate", the MonthPicker will end up in a loop on Android when using "okButton" and it will never "hide".
};

...

{show && (
    <PickerContainer>
            <MonthPicker
              onChange={onValueChange}
              value={monthPickerSelectedDate}
              mode="short"
            />
   </PickerContainer>
)}

...

const PickerContainer = styled.View`
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
`;

That big NOTE (IMPORTANT!!!): in the onValueChange method handler above is what fixed the issue for us.

from react-native-month-year-picker.

ichiyouji avatar ichiyouji commented on August 27, 2024 1

same issue, it's flickering when opened, I think it's opening 3-4 popups on top of each other

-edit- this is just a guess but I think it's caused when the MonthPicker.android.js calling RNMonthPickerDialogModule.open(), this function gets called every time the react native component with the picker element rerenders, the android picker component doesn't track whether there's already a picker component open or not.

from react-native-month-year-picker.

alshcompiler avatar alshcompiler commented on August 27, 2024

for this issue alone i had to replace this library with this one:

https://github.com/mmazzarolo/react-native-modal-datetime-picker

from react-native-month-year-picker.

PunainenAurinko avatar PunainenAurinko commented on August 27, 2024

This used to be working fine in v. 1.6.4. After latest library upgrades I have also started having this issue. Can something be done about it? This is the only RN library for a standalone month year that looks native, it's a shame it doesn't always work correctly.

from react-native-month-year-picker.

PunainenAurinko avatar PunainenAurinko commented on August 27, 2024

@gusparis Is there an update on when this issue could be fixed? Thanks!

from react-native-month-year-picker.

Rutheniceye92 avatar Rutheniceye92 commented on August 27, 2024

setShow(false);

This worked for me.. had move setShow() call on top of onValueChange function.

from react-native-month-year-picker.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.