vue json 編輯組件

Vue-Json編輯 (Vue-Json-Edit)

Visual JSON Editor built as an vue component. Provides a basic GUI.

作為vue組件構建的Visual JSON編輯器。 提供基本的GUI。

View Demo 查看演示 View Github 查看Github

入門 (Getting Started)

npm install vue-json-edit --save

用法 (Usage)

//import it in your project At your entry pointimport vue from 'vue' import JsonEditor from 'vue-json-edit'Vue.use(JsonEditor)

道具 (Props)

• objData: json data

  objData：json數據

• options

  選項

  • confirmText: strings of the confirm button
    ConfirmText：確認按鈕的字符串
  • cancelText: strings of the cancel button
    cancelText：取消按鈕的字符串

例 (Example)

Single file component

單文件組件

<template><JsonEditor:options="{confirmText: 'confirm',cancelText: 'cancel',}":objData="jsonData" v-model="jsonData" ></JsonEditor> </template> <script> export default {...data: function() {return {jsonData: {name: 'mike',age: 23,phone: '18552129932',address: ['AAA C1', 'BBB C2']}}} } </script>

翻譯自: https://vuejsexamples.com/visual-json-editor-built-as-an-vue-component/

vue json 編輯組件

總結

以上是生活随笔為你收集整理的vue json 编辑组件_内置为Vue组件的Visual JSON编辑器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。