无法使用Axios

时间:2018-05-09 09:05:58

标签: php laravel vue.js axios

我试图使用Axios使用Vue存储表单数据。

这是vue模板:

  <template id="AddEmployee">
    <div>
     <h3> Add new post</h3>
     <form v-on:submit.prevent="createEmployee">
       <div class="form-group">
         <label> name</label>
         <input type="text"  v-model="employee.name" class="form-control" required placeholder="">
       </div>
       <div class="form-group">
         <label> Email</label>
         <input type="email"  v-model="employee.email" class="form-control" required placeholder="">
       </div>
       <button type="submit" class="btn btn-xs btn-primary"> Create </button>
       <router-link class="btn btn-xs btn-warning" v-bind:to="'/crud/public/'"> Cancel</router-link>
     </form>
    </div>
</template>

<script>
    export default {
      data:function()
      {
        return {employee: { name:'', email:''}}
      },
      methods:{
        createEmployee:function()
        {
          let uri = 'http://localhost/crud/public/employees';
           Axios.post(uri, this.employee).then((response)=>{
            this.$router.push({name: 'Employees'})
           })
        }
      }
    }
</script>

这是我的路线:

Route::resource('/employees','EmployeeController');

这是控制器部分:

public function store(Request $request)
{
    $this->validate($request, [
      'name' => 'required',
      'email' => 'required',
    ]);

    $create = Employee::create($request->all());
    return response()->json(['status' => 'success','msg'=>'Employee created successfully']);
}

以下是app.js

中定义的路线
const routes = [
    {
        name : 'Employees',
        path: '/crud/public/',
        component : Employees
    },
    {
        name : 'AddEmployee',
        path: '/crud/public/AddEmployee',
        component : AddEmployee
    }
   ]

但问题是它将我重定向到Employees路由,但没有存储在数据库中。

0 个答案:

没有答案