database - laravel vue - axios's methods not working correctly after upload project -


after uploaded site in xampp's virtualhost axios methods stopped working.(but site working well)

httpd-vhosts:

namevirtualhost *:80 <virtualhost *:80>     documentroot c:\xampp\htdocs\zbudwew\public     servername localhost     <directory c:\xampp\htdocs\zbudwew\public>         order allow,deny         allow     </directory> </virtualhost> 

.env:

db_connection=mysql db_host=127.0.0.1 db_port=3306 db_database=zbudwew db_username=root db_password= 

example axios method:

axios.post('api/news/', this.info).then(response => {                         this.news.unshift(response.data.info);                         this.info = {title: '', body:''};                         console.log(response.data);                      }, response => {                         this.errors = response.data;                     }); 

on localhost:8000 address site , adding content working good, if trying add content on 192.168.0.199 address getting errors:

[vue warn]: error in render function: "typeerror: cannot read property 'title' of undefined"  found in  ---> <info> @ c:\xampp\htdocs\zbudwew\resources\assets\js\components\info.vue        <newsmanagement> @ c:\xampp\htdocs\zbudwew\resources\assets\js\components\newsmanagement.vue          <root> 

which werid, because:

axios.get('api/news').then(response => {                 this.news = response.data.news;             }); 

is working correctly. guys give me advice how solve this?

data property , axios.post looks this:

data() {         return {             show: false,             news: [],             errors: [],             info: {                 title: '',                 body: '',             }         }     }, components: {         info     }, created() {         this.fetchnews();     }, methods: {         fetchnews() {             axios.get('api/news').then(response => {                 this.news = response.data.news;             });         }, createinfo() {             axios.post('api/news/', this.info).then(response => {                 this.news.unshift(response.data.info);                 this.info = {                     title: '',                     body: ''                 };             });         } 

info component looks this:

<template>     <tr>         <td>             <span id="errorinfo"></span>             <input type="text" class="form-control"                 v-model="editform.title" v-if="edit" placeholder="tytuł">             <span v-else>{{ info.title }}</span>             <br>             <div v-if="edit">                 <textarea id="editorinfo" name="editorinfo" type="text" class="form-control"                     v-model="editform.body" ></textarea>             </div>             <span v-else></span>          </td>           <td align="right">             <button v-on:click="editinfo" type="button" class="btn btn-info"                 v-if="!edit"             >edytuj</button>             <button v-on:click="$emit('delete-info', info)" type="button" class="btn btn-danger"                 v-if="!edit">usuń</button>               <button v-on:click="updateinfo(info, editform)" type="button" class="btn btn-primary"                 v-if="edit"             >gotowe</button>             <button v-on:click="canceledit" type="button" class="btn btn-default"                 v-if="edit"             >anuluj</button>         </td>     </tr> </template>  <script>     export default {         props: ['info'],         data(){             return {                 edit: false,                 editform:{                     title: '',                     body:''                 }             }         },         methods: {             editinfo(){                 this.edit = true;                 this.editform.title = this.info.title;                 this.editform.body = this.info.body;                 window.settimeout(function(){                     try{                         ckeditor.replace('editorinfo');                      }catch(e){}                 }, 1);                 $('#errorinfo').html('');             },             canceledit(){                 this.edit = false;                 this.editform.title = '';                 this.editform.body = '';                 $('#errorinfo').html('');             },             updateinfo(olduser, newuser){                   newuser.body = ckeditor.instances.editorinfo.getdata();                 $('#errorinfo').html('');                 if (newuser.body == '' || newuser.title == ''){                     if(newuser.body == ''){                         $('#errorinfo').append('treść jest wymagana nie może być pusta.<br>');                     }                      if(newuser.title == ''){                         $('#errorinfo').append('tytuł jest wymagany nie może być pusty.');                     }                 } else {                      axios.patch('/api/news/' + olduser.id, newuser).then(response=>                     {                         this.$emit('update-info');                         this.canceledit();                         console.log(response.data);                     });                  }                }         }     } </script>   <style> #errorinfo {     color: #660000; } </style> 

i solved problem!

firstly needed separate methods in web.php file this:

route::post('/api/newsadd', 'newscontroller@store'); 

that before:

route::resource('api/news', 'newscontroller'); 

sedcondly there problem slashes:

before: axios.post('api/newsadd/', this.info)

after: axios.post('api/newsadd', this.info)


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -