vfg-field-sourcecode

A source code field for vue-form-generator

Example

<template>
  <vue-form-generator :schema="schema" :model="model"></vue-form-generator>
</template>
<script>
export default {
  data() {
    return {
      model: {
        source: `<template></template>`
      },
      schema: {
        fields: [{
          type: "sourcecode",
          label: "source code",
          model: "source"
        }]
      }
    };
  }
};
</script>

Installation

npm install vfg-field-sourcecode

vfg-field-sourcecode can be used as a module in both CommonJS and ES modular environments.

When in non-modular environment, vfg-field-sourcecode will register all the components to vue by itself.

ES6

//
// You can register a component manually
//
import { FieldSourcecode } from 'vfg-field-sourcecode';

export default {
  ...
  components: {
    'field-sourcecode': FieldSourcecode
  },
  ...
};

//
// or register the whole module with vue
//
import ModuleLibrary from 'vfg-field-sourcecode';

// Install this library
Vue.use(ModuleLibrary);

CommonJS

//
// You can register a component manually
//
var Vue = require('vue');
var ModuleLibrary = require('vfg-field-sourcecode');

var YourComponent = Vue.extend({
  ...
  components: {
    'field-sourcecode': ModuleLibrary.FieldSourcecode
  },
  ...
});

//
// or register the whole module with vue
//
var Vue = require('vue');
var ModuleLibrary = require('vfg-field-sourcecode');

// Install this library
Vue.use(ModuleLibrary);

Browser

<script src="path/to/vue/vue.min.js"></script>
<script src="path/to/vfg-field-sourcecode/dist/vfg-field-sourcecode.min.js"></script>
<!-- Components are registered globally -->

After that, you can use it with Vue Form Generator:

  schema: {
    fields: [
      {
        type: "sourcecode",
        label: "source code",
        model: "source"
      }
    ]
  }

Changelog

See the GitHub release history.

Contributing

See CONTRIBUTING.md.