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

fix(VCalendar): touchmove does not notice category change #14084

Merged
merged 6 commits into from
Oct 11, 2021

Conversation

yuwu9145
Copy link
Member

@yuwu9145 yuwu9145 commented Aug 25, 2021

fixes #12366 & #13174

Description

fixes #12366
fixes #13174

According to developer api for Touch.target:

Touch.target Returns the Element (EventTarget) on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document.

Solution: For touchmove event, if moving point is outside initial touchstart dom, do not trigger corresponding Vue event but re-dispatch the same touchmove event from the hovering dom @johnleider

Motivation and Context

How Has This Been Tested?

visually

Markup:

// Paste your FULL Playground.vue here
<template>
  <v-container>
    <v-calendar 
      type="category"
      category-show-all
      :categories="categories"          
      :events="events"
      @mousemove:time-category="move"
      @touchmove:time-category="move"
    />
    <v-calendar 
      type="week"
      :events="events"
      @mousemove:time="move2"
      @touchmove:time="move2"
    />
  </v-container>
</template>

<script>
export default {
  data: () => ({
    events: [],
    categories: ['John Smith', 'Tori Walker'],
    moveCategory: null
  }),
  methods: {
    move({category}) {
      console.log(category)
      this.moveCategory = category
    },
    move2({date, time}) {
      console.log(date, time)
      this.moveCategory = date + ', ' + time
    }
  },
};
</script>

<style>
.scrolling-div {
  width: 200px;
  height: 100px;
  overflow: auto;
  white-space: nowrap;
}
</style>

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Improvement/refactoring (non-breaking change that doesn't add any features but makes things better)

Checklist:

  • The PR title is no longer than 64 characters.
  • The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and backwards compatible changes and next for non-backwards compatible changes).
  • My code follows the code style of this project.
  • I've added relevant changes to the documentation (applies to new features and breaking changes in core library)

@yuwu9145 yuwu9145 marked this pull request as draft September 5, 2021 02:17
@yuwu9145 yuwu9145 marked this pull request as ready for review September 5, 2021 05:00
@KaelWD KaelWD changed the title Fix(VCalendarCategory): fix touchmove does not notice category change fix(VCalendar): touchmove does not notice category change Oct 11, 2021
@KaelWD KaelWD merged commit 1ec8c6a into vuetifyjs:master Oct 11, 2021
mcdmaster pushed a commit to mcdmaster/vuetify that referenced this pull request Oct 25, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants