J'ai ce formulaire dans ma page ContactView.vue src/views/ContactView.vue : je souhaite rediriger vers une page personnalisée avec la méthode de message de remerciement src/views/SuccessView.vue<formname="contact-form"action="/success" ="POST&amp

Utilisez le formulaire netlify pour obtenir 404 (VueJs 3 + Vite + VueRouter + Netlify)-Questions et réponses sur le réseau chinois PHP

<p>我的 ContactView.vue 页面中有此表单 <code>src/views/ContactView.vue</code> ：我想重定向到自定义页面，感谢消息 <code>src/views/SuccessView.vue</code></p> <pre class="brush:php;toolbar:false;"><form name="contact-form" action="/succès" method="POST" data-netlify = "true" data-netlify-honeypot="champ-bot"> <type d'entrée="caché" name="formulaire-contact" value="formulaire-contact" /> <div class="grid md:grid-cols-2 md:gap-6"> <div class="groupe relatif z-0 w-full mb-6"> <type d'entrée="texte" name="prénom" id="floating_first_name" class = "bloc py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine apparence-aucun focus: contour-aucun focus: anneau-0 focus :border-peer bubblegum" espace réservé = " " requis /> <label for="prénom" class = "peer-focus: police-medium absolu texte-sm texte-gris-500 durée-300 transformation -translate-y-6 échelle-75 top-3 -z-10 origine-[0] peer-focus:gauche -0 peer-focus:text-bubblegum peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6">Premier nom</étiquette> </div> <div class="groupe relatif z-0 w-full mb-6"> <type d'entrée="texte" name="nom_de_famille" id="floating_last_name" class = "bloc py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine apparence-aucun focus: contour-aucun focus: anneau-0 focus :border-peer bubblegum" espace réservé = " " requis /> <label for="nom de famille" class = "peer-focus: police-medium absolu texte-sm texte-gris-500 durée-300 transformation -translate-y-6 échelle-75 top-3 -z-10 origine-[0] peer-focus:gauche -0 peer-focus:text-bubblegum peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6">Dernier nom</étiquette> </div> </div> <div class="groupe relatif z-0 w-full mb-6"> <type d'entrée="e-mail" nom = "e-mail" id="floating_email" class = "bloc py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine apparence-aucun focus: contour-aucun focus: anneau-0 focus :border-peer bubblegum" espace réservé = " " requis /> <label for="e-mail" class = "peer-focus: police-medium absolu texte-sm texte-gris-500 durée-300 transformation -translate-y-6 échelle-75 top-3 -z-10 origine-[0] peer-focus:gauche -0 peer-focus:text-bubblegum peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6">E-mail adresse</étiquette> </div> <div class="groupe relatif z-0 w-full mb-6"> <textarea type="texte" nom = "zone de texte" id="floating_ext_area" class = "bloc py-2.5 px-0 w-full text-sm text-gray-900 bg-transparent border-0 border-b-2 border-pine apparence-aucun focus: contour-aucun focus: anneau-0 focus :border-peer bubblegum" espace réservé = " " requis /> <label for="textarea" class = "peer-focus: police-medium absolu texte-sm texte-gris-500 durée-300 transformation -translate-y-6 échelle-75 top-3 -z-10 origine-[0] peer-focus:gauche -0 peer-focus:text-bubblegum peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6">Votre Message</étiquette> </div> <type de bouton="soumettre" class="texte-blanc bg-bubblegum hover:bg-cherry focus:ring-4 focus:outline-none focus:ring-cotton-candy font-medium arrondi-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center">Soumettre</bouton> </form></pre> <p>J'ai suivi tous les guides présents sur place et sur les forums associés mais personne n'a pu m'aider. </p> <p>J'ai lu cet article mais il ne semble pas fonctionner pour moi. </p> <p>La plupart des guides et tutoriels mentionnent des clones HTML exacts comme squelettes dans le HTML "public", donc dans index.html j'ai fait quelque chose de similaire</p> <pre class="brush:php;toolbar:false;"><body> <form netlify netlify-honeypot="champ-bot" nom caché="formulaire-contact" méthode="POST" <type d'entrée="texte" nom="prénom" /> <type d'entrée="texte" nom="nom de famille" <type d'entrée="e-mail" nom="e-mail" /> <textarea name="textarea"></textarea> <type de bouton="soumettre"></bouton> </formulaire> <div id="app"></div> <script type="module" src="/src/main.js"></script> </corps></pré> <p>Lorsque j'essaie de remplir le formulaire dans <code>random-netlify-name-784120.netlify.app</code> immédiatement après l'avoir rempli, je vois un écran noir avec cette réponse. ≪ /p> <p>Comment puis-je faire en sorte que tout se passe bien ? </p>

répondre à tous(1)

P粉4706452222023-09-03 10:33:53 1 plancher

As-tu réussi ? J'ai eu un problème similaire et je n'ai pu le résoudre qu'en supprimant le paramètre action='/success/' et en laissant Netlify rediriger vers sa propre page...

L'ajax personnalisé ne fonctionne pas non plus car la récupération de '/' renvoie 404...

Toujours en cours d'exécution sur une page personnalisée ou un gestionnaire personnalisé... si je trouve quelque chose, je le publierai.

(J'utilise Vite + React + Netlify) Pas de package routeur... Je peux obtenir une page pages/success dans mon vite.config.tsvite.config.ts

中获得一个 pages/success

build: {
    ...,
    rollupOptions: {
      input: {
        main: resolve(root, 'index.html'),
        success: resolve(root, 'pages', 'success', 'index.html'),
      },
    }

Comme +0

Ajouter une réponse