Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: limbo-works/Limbo.Nuxt.FetchForm
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: 0.0.5
Choose a base ref
...
head repository: limbo-works/Limbo.Nuxt.FetchForm
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: 0.1.0
Choose a head ref
  • 1 commit
  • 3 files changed
  • 1 contributor

Commits on Nov 7, 2023

  1. feat: added mockup response prop and functionality

    Simon Erslev Milfred committed Nov 7, 2023
    Copy the full SHA
    a3e151e View commit details
Showing with 20 additions and 1 deletion.
  1. +1 −0 .playground/app.vue
  2. +18 −0 components/FetchForm.vue
  3. +1 −1 package.json
1 change: 1 addition & 0 deletions .playground/app.vue
Original file line number Diff line number Diff line change
@@ -3,6 +3,7 @@
<FetchForm
:action="`https://pokeapi.co/api/v2/pokemon/${pokemon.toLowerCase()}`"
#default="{ isFetching, currentResponse, currentError }"
:mockup-response="(data) => ({ name: 'ditto', data })"
@response="onResponse"
@error="onError"
>
18 changes: 18 additions & 0 deletions components/FetchForm.vue
Original file line number Diff line number Diff line change
@@ -39,6 +39,8 @@ const props = defineProps({
useNativeFormDataOnPost: Boolean,
mockupResponse: null,
// Disable submitting the form
disabled: Boolean,
});
@@ -119,6 +121,22 @@ function onSubmit(e) {
let success = true;
isFetching.value = true;
// Get mockup response
if (props.mockupResponse) {
const data = typeof props.mockupResponse === 'function' ? props.mockupResponse?.(payload) : props.mockupResponse;
emit('fetch', null);
emit('response', data);
emit('response:full', { data });
emit('complete', true);
currentResponse.value = props.mockupResponse;
currentError.value = null;
isFetching.value = false;
return;
}
const fetch = useFetch(origin + actionURL.pathname + actionURL.search, {
// Add form data to POST requests
body: method.value === 'POST' ? payload : undefined,
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "@limbo-works/fetch-form",
"type": "module",
"version": "0.0.5",
"version": "0.1.0",
"main": "./nuxt.config.js",
"scripts": {
"dev": "nuxi dev .playground",