{"id":21525837,"url":"https://github.com/bkwld/vue-netlify-form","last_synced_at":"2026-05-17T20:11:37.546Z","repository":{"id":43308791,"uuid":"346459375","full_name":"BKWLD/vue-netlify-form","owner":"BKWLD","description":"Renders a form element for use with Netlify Forms that validates Netlify conventions and handles submission.","archived":false,"fork":false,"pushed_at":"2022-10-19T19:00:37.000Z","size":168,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-30T11:02:01.264Z","etag":null,"topics":["form","netlify","vue"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/BKWLD.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-03-10T18:51:43.000Z","updated_at":"2022-10-19T03:24:54.000Z","dependencies_parsed_at":"2023-01-20T07:34:18.573Z","dependency_job_id":null,"html_url":"https://github.com/BKWLD/vue-netlify-form","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/BKWLD/vue-netlify-form","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BKWLD%2Fvue-netlify-form","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BKWLD%2Fvue-netlify-form/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BKWLD%2Fvue-netlify-form/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BKWLD%2Fvue-netlify-form/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BKWLD","download_url":"https://codeload.github.com/BKWLD/vue-netlify-form/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BKWLD%2Fvue-netlify-form/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33153666,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-17T09:28:26.183Z","status":"ssl_error","status_checked_at":"2026-05-17T09:27:52.702Z","response_time":107,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["form","netlify","vue"],"created_at":"2024-11-24T01:38:39.082Z","updated_at":"2026-05-17T20:11:37.518Z","avatar_url":"https://github.com/BKWLD.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-netlify-form\n\nThis component was created to simplify submission to [Netlify Forms](https://docs.netlify.com/forms) and help catch common mistakes.\n\n## Features\n\n- Validates presence of form and field names.  Form name is a required prop.  The presence of field names is validated during development (by checking `NODE_ENV != \"production`) and emits a console warning like `Missing Netlify form field named: Email` if a form field lacks a name.\n- Submits form data to Netlify using [@nuxt/axios](https://axios.nuxtjs.org/).\n- Passes form lifecycle state through scoped slots.\n\n## Usage\n\n```vue\n\u003ctemplate\u003e\n\n  \u003cnetlify-form name='Contact' :form='form'\u003e\n    \u003ctemplate #default='{readonly, submitting, submitted}'\u003e\n\n      \u003cp v-if='submitted'\u003eThanks for your submission\u003c/p\u003e\n\n      \u003cinput\n        name='Email'\n        placeholder='Email'\n        v-model='form.Email'\n        :readonly='readonly'\u003e\n\n      \u003cbutton\u003e\n        {{ submitting ? 'Submitting' : 'Submit' }}\n      \u003c/button\u003e\n\n    \u003c/template\u003e\n  \u003c/netlify-form\u003e\n\n\u003c/template\u003e\n\n\u003cscript\u003e\n\nexport default {\n  data: function() {\n    form: {\n      Email: ''\n    }\n  }\n}\n\n\u003c/script\u003e\n```\n\n## Props\n\n| Name | Default | Description |\n| ---- | ------- | ----------- |\n| `name` | _required_ | The name of the form.  This will be how the form shows up within the Netlify Forms dashboard |\n| `form` | _required_ | The form data as key/value pairs.  This is what your form fields are updating on input.  You may want to title case the keys as these are what are displayed within the Netlify Forms dashboard |\n| `endpoint` | `/` | Where the form should submit to.  On production, the form should POST to the root of your site.  While dev-ing locally, you may want to pass the hostname of your Netlify app here so you can post to it from your localhost.  This also reads from `process.env.NETLIFY_FORMS_ENDPOINT`. |\n\n## Notes\n\n#### CORS when using `endpoint`\n\nIf you're going to use the `endpoint` prop to submit to your production endpoint from localhost, you should add something like the following to `_headers` to allow those requests.\n\n```\n/\n  Access-Control-Allow-Origin: http://localhost:3000\n  Access-Control-Allow-Methods: POST\n  Access-Control-Allow-Headers: content-type\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbkwld%2Fvue-netlify-form","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbkwld%2Fvue-netlify-form","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbkwld%2Fvue-netlify-form/lists"}