0.0.6 • Published 2 years ago

vue-relay-runner v0.0.6

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

A vue3 component across router with animations

Install and basic usage

$ npm i -s vue-relay-runner

only works for Vue 3

global registration:

import { createApp } from 'vue';
import VueRelayRunner from 'vue-relay-runner';
import 'vue-relay-runner/dist/relay.css';

const app = createApp(App);
app.use(VueRelayRunner);

Use the component:

// a.page
<template>
  <div id="aPage">
    <vue-relay-runner :id="1">
      // your component
    </vue-relay-runner>
  </div>
</template>

// b.page
<template>
  <div id="bPage">
    <vue-relay-runner :id="1">
      // your component
    </vue-relay-runner>
  </div>
</template>

<script>
  import VueRelayRunner from 'vue-relay-runner';
  import 'vue-relay-runner/dist/relay.css';
  export default {
      name: 'app',
      components: {
          VueRelayRunner
      }
  }
</script>

Props

id

Type: number | string Required: true a unique id for component to get their context

<vue-relay-runner id="1" />

styleAttr

Type: Object Required: false you can set some Style for the component

<vue-relay-runner :styleAttr={
  borderRadius: 50%
}/>

duration

Type: number | string Required: false you can set the animation duration

<vue-relay-runner duration="800"/>

License

MIT license