vue-npm-banner v1.0.5

vue-npm-banner

This is an exemple of yarn package for my own Vue.js single file components.

Add it in your project

From npm

yarn add vue-npm-banner

From Github

yarn add https://github.com/Meyclem/vue-npm-banner.git

Usage

Details

There are two components:

• Banner, which obviously is an horrible ugly banner component
  • The component takes one prop, backgroundImageUrl, of type String
  • It has two slots, one for the title, one for the button's text.
  • It has also a @click directive that you can use to pass a function to fire on click (of course!)
• Time, which gives you...current time

Require it in your components

<template>
  <div id="app">

    <Banner
      @click="functionToFireOnClick()"
      backgoundImageUrl="urlToYourImage">
        <template slot="title">
          A nice title
        </template>
        <template slot="button">
          A button
        </template>
    </Banner>

    <Time/>

  </div>
</template>

<script>
import { Banner, Time } from 'vue-npm-banner'

export default {
  name: 'app',
  components: {
    Banner,
    Time
  },
  methods: {
    functionToFireOnClick () {
      // some code to execute
    }
  }
}
</script>