Question

当我将产品添加到购物车时，我使用以下代码：

addproduct(itemId) {
    this.showLoading = true
    this.$http.post('/shampoo', {'item': itemId}).then((response) => {
        swal({
            title: "Success!",
            text: "Product added to your basket!",
            type: "success",
            timer: 1500,
            showConfirmButton: false
        })
        this.showLoading = false
    }, (response) => {
        this.showLoading = false
    })

我创建了一个弹出窗体，当没有产品在购物车上时，一旦他们点击弹出的添加到购物车按钮，一旦产品是他们在购物车，如果任何人需要添加另一个产品它再次显示弹出窗口。如果产品在购物车上，我不想要弹出窗口

这是弹出窗体的代码

show() {
    this.showLoading = true;

    $(".loading").css('display', 'block');
    $('#products').modal("hide");

    //
    let code = $('input[name=code]').val();

    if(code) {
        this.$http.post('/codee', { code: code}).then((response) => {
            // $('#basic-form').submit();
    }, (response) => {
        swal({
            title: "Error!",
            text: "Sorry this Code is invalid!",
            type: "error",
            timer: 2500,
            showConfirmButton: false
        })

        $(".loading").css('display', 'none');

        this.showLoading = false
        $('input[name=code]').val('')
    })

Answer 1

当您单击添加到购物车时，在服务器端，您需要检查商品ID是否在购物车中并返回一个标志，以指示该商品是否在猫中。我假设此代码负责弹出窗口。

swal({
 title: "Error!",
 text: "Sorry this Code is invalid!",
 type: "error",
 timer: 2500,
 showConfirmButton: false
})

您需要检查服务器返回的值，如果它返回一个标志，表明该项已经存在，则返回false;这将阻止弹出代码被访问。或者你可以将pop代码包装在if语句中。 e.g

if(response.flag === 1){
  return false;
  // your pop up code goes here
}

or

if(response.flag === 0){
  // your pop up code goes here
}

// flag can assume 0 => Added but does not exist, 1=> added but already 
// exist. ect
// while the actual data will be stored in response.data

但我想知道你实施这个的原因。如果用户单击“添加到购物车”，则应该增加该购物车中已存在的相同商品的数量

购物车中有产品时没有弹出窗口

1 个答案: