{"id":13559124,"url":"https://github.com/formio/vue","last_synced_at":"2025-06-19T05:03:39.633Z","repository":{"id":38324258,"uuid":"92869999","full_name":"formio/vue","owner":"formio","description":"Javascript Powered forms and JSON form builder for Vue.js","archived":false,"fork":false,"pushed_at":"2024-04-03T18:50:40.000Z","size":252,"stargazers_count":116,"open_issues_count":4,"forks_count":64,"subscribers_count":25,"default_branch":"master","last_synced_at":"2024-05-17T04:04:37.429Z","etag":null,"topics":["vue","vuejs"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/formio.png","metadata":{"files":{"readme":"README.md","changelog":"Changelog.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-05-30T19:46:07.000Z","updated_at":"2024-06-18T15:29:42.650Z","dependencies_parsed_at":"2022-07-11T02:00:38.462Z","dependency_job_id":"74ccd726-d2d9-4518-a014-4c3ecd64b793","html_url":"https://github.com/formio/vue","commit_stats":{"total_commits":67,"total_committers":16,"mean_commits":4.1875,"dds":0.6119402985074627,"last_synced_commit":"82bdecc878cbe00614765ecc84ee78ab1be06b8e"},"previous_names":["formio/vue-formio"],"tags_count":19,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/formio%2Fvue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/formio%2Fvue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/formio%2Fvue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/formio%2Fvue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/formio","download_url":"https://codeload.github.com/formio/vue/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247018431,"owners_count":20870003,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["vue","vuejs"],"created_at":"2024-08-01T12:05:21.832Z","updated_at":"2025-04-03T14:31:19.744Z","avatar_url":"https://github.com/formio.png","language":"TypeScript","funding_links":[],"categories":["TypeScript","vuejs"],"sub_categories":[],"readme":"# @formio/vue\n\nA [Vue.js](https://vuejs.org/) component for rendering out forms based on the [Form.io](https://www.form.io) platform.\n\n## Install\n\n### npm\n\n`Vue Formio` can be used on the server, or bundled for the client using an\nnpm-compatible packaging system such as [Browserify](http://browserify.org/) or\n[webpack](http://webpack.github.io/).\n\n```\nnpm install @formio/vue --save\n```\n\n## Basic Usage\n\nHTML inside of Vue template file:\n```\n\u003ctemplate\u003e\n  \u003cdiv id=\"app\"\u003e\n    \u003cformio src=\"\" url=\"\" form=\"\" submission=\"\" options=\"\" v-on:submit=\"\"\u003e\u003c/formio\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n```\n\nJavascript inside of Vue template file.\n```\n\u003cscript\u003e\n  import { Form } from '@formio/vue';\n  export default {\n      name: 'app',\n      components: { formio: Form },\n  }\n\u003c/script\u003e\n```\n## Props\n\n### `src` : `string`\n\nThe form API source from [form.io](https://www.form.io) or your custom formio server.\n\nSee the [Creating a form](https://help.form.io/userguide/forms/form-creation#creating-a-form)\nfor where to set the API Path for your form.\n\nYou can also pass in the submission url as the `src` and the form will render with the data populated from the submission.\n\n### `url` : `string`\n\nIf you pass in the form and submission directly, some components such as resources, files and forms need to know the url of the form on the server. Pass it in with the url option. \n\n### `form` : `object`\n\nAn object representing the form. Use this instead of src for custom forms. \n\n**Note:** `src` will override this property if used.\n\n### `submission`: `Object`\n\nAn object representing the default data for the form.\n\n**Note:** `src` will override this if a submission url is entered.\n\n### `options`: `object`\n\nAn object with the formio.js options that is passed through. See [Form.io Options](https://help.form.io/developers/form-development/form-renderer#form-renderer-options).\n\n## Events\n\nAll events triggered from the form are available via the v-on property. See [Form.io Events](https://help.form.io/developers/form-development/form-renderer#form-events) for all the available events.\n\nThen on the form set `\u003cformio src=\"myform\" v-on:submit=\"doSomething\" /\u003e`\n\n## FormBuilder\n\nHTML inside of Vue template file:\n```\n\u003ctemplate\u003e\n  \u003cdiv id=\"app\"\u003e\n    \u003cformbuilder v-bind:form=\"{display: 'form'}\" v-bind:options=\"{}\" v-on:change=\"(schema) =\u003e console.log(schema)\"\u003e\u003c/formbuilder\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n```\n\nJavascript inside of Vue template file.\n```\n\u003cscript\u003e\n  import { FormBuilder } from '@formio/vue';\n  export default {\n      name: 'app',\n      components: { FormBuilder },\n  }\n\u003c/script\u003e\n```\n\n## Form Actions\n\nGet access to the form instance\n```\n\u003ctemplate\u003e\n  \u003cdiv id=\"app\"\u003e\n    \u003cformio ref=\"formioForm\"\u003e\u003c/formio\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n```\n\nRun a method\n```\nthis.$refs.formioForm.formio.submit()\n```\n\nAll methods are available here https://help.form.io/developers/form-renderer#form-methods \n\n## License\nReleased under the [MIT License](http://www.opensource.org/licenses/MIT).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fformio%2Fvue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fformio%2Fvue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fformio%2Fvue/lists"}