Almost EVERYONE who tried headless systems said they saw benefits. Download the state of CMS now!

Storyblok now on AWS Marketplace: Read more

O’Reilly Report: Decoupled Applications and Composable Web Architectures - Download Now

Empower your teams & get a 582% ROI: See Storyblok's CMS in action

Skip to main content

How to track changes of the current Story from a Plugin?

  • FAQ
  • How to track changes of the current Story from a Plugin?

With the code below you are able to track changes to the storyItem when developing a custom field type of Storyblok.

const Fieldtype = {
  mixins: [window.Storyblok.plugin],
  template: `<div><input class="uk-width-1-1" v-model="model.example" /></div>`,
  methods: {
    initWith() {
      return {
        plugin: 'example_plugin',
        example: 'Hello world!'
      }
    },
    pluginCreated() {
      setInterval(() => {
        this.$emit('get-context')
      }, 100)
    }
  },
  watch: {
    'storyItem': function(newVal, old) {
      if (window.JSON.stringify(old) != window.JSON.stringify(newVal)) {
        console.log('Story changed', old, newVal)
      }
    },
    'model': {
      handler: function (value) {
        this.$emit('changed-model', value);
      },
      deep: true
    }
  }
}