123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122 |
- export default {
- name: 'NuxtChild',
- functional: true,
- props: {
- nuxtChildKey: {
- type: String,
- default: ''
- },
- keepAlive: Boolean,
- keepAliveProps: {
- type: Object,
- default: undefined
- }
- },
- render (_, { parent, data, props }) {
- const h = parent.$createElement
- data.nuxtChild = true
- const _parent = parent
- const transitions = parent.$nuxt.nuxt.transitions
- const defaultTransition = parent.$nuxt.nuxt.defaultTransition
- let depth = 0
- while (parent) {
- if (parent.$vnode && parent.$vnode.data.nuxtChild) {
- depth++
- }
- parent = parent.$parent
- }
- data.nuxtChildDepth = depth
- const transition = transitions[depth] || defaultTransition
- const transitionProps = {}
- transitionsKeys.forEach((key) => {
- if (typeof transition[key] !== 'undefined') {
- transitionProps[key] = transition[key]
- }
- })
- const listeners = {}
- listenersKeys.forEach((key) => {
- if (typeof transition[key] === 'function') {
- listeners[key] = transition[key].bind(_parent)
- }
- })
- if (process.client) {
- // Add triggerScroll event on beforeEnter (fix #1376)
- const beforeEnter = listeners.beforeEnter
- listeners.beforeEnter = (el) => {
- // Ensure to trigger scroll event after calling scrollBehavior
- window.$nuxt.$nextTick(() => {
- window.$nuxt.$emit('triggerScroll')
- })
- if (beforeEnter) {
- return beforeEnter.call(_parent, el)
- }
- }
- }
- // make sure that leave is called asynchronous (fix #5703)
- if (transition.css === false) {
- const leave = listeners.leave
- // only add leave listener when user didnt provide one
- // or when it misses the done argument
- if (!leave || leave.length < 2) {
- listeners.leave = (el, done) => {
- if (leave) {
- leave.call(_parent, el)
- }
- _parent.$nextTick(done)
- }
- }
- }
- let routerView = h('routerView', data)
- if (props.keepAlive) {
- routerView = h('keep-alive', { props: props.keepAliveProps }, [routerView])
- }
- return h('transition', {
- props: transitionProps,
- on: listeners
- }, [routerView])
- }
- }
- const transitionsKeys = [
- 'name',
- 'mode',
- 'appear',
- 'css',
- 'type',
- 'duration',
- 'enterClass',
- 'leaveClass',
- 'appearClass',
- 'enterActiveClass',
- 'enterActiveClass',
- 'leaveActiveClass',
- 'appearActiveClass',
- 'enterToClass',
- 'leaveToClass',
- 'appearToClass'
- ]
- const listenersKeys = [
- 'beforeEnter',
- 'enter',
- 'afterEnter',
- 'enterCancelled',
- 'beforeLeave',
- 'leave',
- 'afterLeave',
- 'leaveCancelled',
- 'beforeAppear',
- 'appear',
- 'afterAppear',
- 'appearCancelled'
- ]
|