vue-side-effect

Vue.js version of react-side-effect

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

Usage

Here's how to implement Vue Document Title (client side only) using Vue Side Effect (maybe outdate):

import Vue from 'vue'
import VueSideEffect from 'vue-side-effect'

const sideEffect = new VueSideEffect({
  reducePropsToState(propsList) {
    var innermostProps = propsList[propsList.length - 1]
    if (innermostProps) {
      return innermostProps.title
    }
  },
  handleStateChangeOnClient(title) {
    var nextTitle = title || ''
    if (nextTitle !== document.title) {
      document.title = nextTitle
    }
  }
})

export default {
  sideEffect: sideEffect,
  name: 'document-title',
  props: {
      title: {
          type: String,
          required: true
      }
  },
  render(h) {
      h(this.$slots.default)
  }
}

TODO

• [ ] test
• [ ] flowtype