不去重定向视图

Question

我有一个商店功能，用于产品编辑，

public function store(Request $request)
        {
            $this->validate($request, [
                'name' => 'required',
                'category_id' => 'required'
            ]);
    
            if (!empty($request->product_id)) {
                $product = StoreProduct::findOrFail($request->product_id);
                $product->update($request->except('_token'));
                session()->flash('flash_message', 'The product has been updated!');
                return redirect()->route('product.index');
            }
    }

Vue组件的方法调用如下，

methods: {
    saveProduct: function () {
        let data = {
            'name' : this.translate.name,
            'category_id' : this.product.id,
            'product_id' : this.translate.product_id,
        }
       axios.post('/store-product', data);
    }
}

所有工作的功能 fine.but 都不会转到通过此路由重定向的视图 (product.index) 并保留编辑页面。重定向部分有问题吗？

谢谢！

Answer 1

这不是 axios 请求的工作方式。如果您使用常规形式，您的重定向将起作用；然而，由于这是一个 javascript 请求，axios 不支持该重定向。看到这个 issue。最简单的解决方案是 return 重定向路由：

public function store(Request $request)
{
   $this->validate($request, [
       'name' => 'required',
       'category_id' => 'required'
   ]);
    
   if (!empty($request->product_id)) {
       $product = StoreProduct::findOrFail($request->product_id);
       $product->update($request->except('_token'));
       session()->flash('flash_message', 'The product has been updated!');
       return response(['redirect' => route('product.index')];
   }
}

然后在您的 axios 请求中（这是未经测试的，解析响应可能略有偏差）：

axios.post('/store-product', data).then(function(response){
  const response = JSON.parse(response.data.response);

  //redirect logic
  if (response.redirect) {
    window.location.href = response.redirect;
  }
})

Answer 2

我已经解决了问题，

axios.post('/store-product', data).then(function(response){

  //redirect logic
  if (response.data.status) {
    window.location.href = '/products';
  }
})