A Vue.js component for editing data that has been serialized in PHP
Vue JavaScript HTML CSS
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
app Update App.vue May 24, 2018
build Setup tests Jun 28, 2017
dist
src Return output Jun 28, 2017
test/unit Add tests Jun 28, 2017
.babelrc
.gitignore Add yarn.lock Jun 28, 2017
.travis.yml
LICENSE
README.md
package.json
yarn.lock Add yarn.lock Jun 28, 2017

README.md

Build Status

Serialized Editor

A Vue.js component for editing data that has been serialized in PHP.

Requirements

Install

npm install @deliciousbrains/serialized-editor
// or
yarn add @deliciousbrains/serialized-editor

Usage

The package comes in two parts

  1. A SerializedParser class to convert a PHP serialized string into JSON
  2. A SerializedEditor vue.js component

First you need to import the components:

import { SerializedParser, SerializedEditor } from '@deliciousbrains/serialized-editor';

Next you need to convert the serialized data into JSON:

computed: {
    parsedData() {
        var sp = new SerializedParser(serializedString);

        try {
            var json = sp.parse();
            return JSON.parse(json);
        } catch (e) {
            console.error(e);
        }

        return {};
    }
}

Then you can pass the json-data into the component:

<serialized-editor :json-data="parsedData" @output="updateOutput"></serialized-editor>

API

Props

Name Type Description
json-data Object The JSON data returned from the SerializedParser class

Events

Name Description
output Triggered when any data changes. Returns the new value in the PHP serialized format.

Credits

Serialized Editor was created by Gilbert Pellegrom from Delicious Brains. Released under the MIT license.