Question

我正在尝试在VUE Js上构建一个小型电子商务项目，该项目正在通过付款网关进行集成，第三方供应商给了我一个校验和功能，该功能可用于获取价值，应该是从HTML表单传递过来的，所以我有一个函数，该函数接受所有必要的变量，并通过props传递给其他组件中的其他表单。

所以我的代码如下：

checkout() {
    var paramarray = {};
    paramarray['MID'] = MID; //Provided by Paytm
    paramarray['ORDER_ID'] = 'ORDER070913489845456'; //unique OrderId for every request
    paramarray['CUST_ID'] = 'CUST000145';  // unique customer identifier
    paramarray['INDUSTRY_TYPE_ID'] = INDUSTRY_TYPE_ID; //Provided by Paytm
    paramarray['CHANNEL_ID'] = CHANNEL_ID; //Provided by Paytm
    paramarray['TXN_AMOUNT'] = '1.00'; // transaction amount
    paramarray['WEBSITE'] = WEBSITE; //Provided by Paytm
    paramarray['CALLBACK_URL'] = 'https://www.paytm.com';//Provided by Paytm
    paramarray['EMAIL'] = 'abc@gmail.com'; // customer email id
    paramarray['MOBILE_NO'] = '9999999999'; // customer 10 digit mobile no.

    var PAYTM_MERCHANT_KEY = '&uuClCjORCw3UW'

    checksum.genchecksum(paramarray, PAYTM_MERCHANT_KEY, function(err, result) {});

    this.$router.push({name: 'payPaytm', params: { transData: paramarray}});
}

在路由器中我有一个定义：

{
    path: '/pay-paytm',
    component: Vue.component('payPaytm', require('../Payment/Paytm/Views/Redirect.vue')),
    name: 'payPaytm',
    props: true
},

在我要传递这些数据的组件中：

<template>
    <div>
        <h1>Please do not refresh this page...</h1>

        <form method="post" action="https://pguat.paytm.com/oltp-web/processTransaction" name="f1">
            <input name="MID" type="hidden" :value="transData.MID" />
            <input name="ORDER_ID" type="hidden" :value="transData.ORDER_ID" />
            <input name="CUST_ID" type="hidden" :value="transData.CUST_ID" />
            <input name="TXN_AMOUNT" type="hidden" :value="transData.TXN_AMOUNT" />
            <input name="CHANNEL_ID" type="hidden" :value="transData.CHANNEL_ID" />
            <input name="EMAIL" type="hidden" :value="transData.EMAIL" />
            <input name="MOBILE_NO" type="hidden" :value="transData.MOBILE_NO" />
            <input name="INDUSTRY_TYPE_ID" type="hidden" :value="transData.INDUSTRY_TYPE_ID" />
            <input name="WEBSITE" type="hidden" :value="transData.WEBSITE" />
            <input name="CALLBACK_URL" type="hidden" :value="transData.CALLBACK_URL" />
            <input name="CHECKSUMHASH" type="hidden" :value="transData.CHECKSUMHASH"/>
            <button class="thm-btn bgclr-1" data-loading-text="Please wait...">Submit</button>
        </form>
    </div>
</template>

<script>
    export default {
        name: "redirect",
        props: {
            transData: {
                required: true
            }
        },
        created() {
            console.log(this.transData)
        }
    }
</script>

当我尝试做控制台时，我可以看到以下内容：

但是当我看到要添加的元素时，它没有在输入表单中选择CHECKSUMHASH键

我不知道为什么我要从props组件中合并所有变量绑定的元素，只有此chechsumash键无法获取值。帮我解决这个问题。

Answer 1

可能的原因是import { Observable, EMPTY, throwError } from 'rxjs'; import { catchError } from 'rxjs/operators'; private authInterceptor(observable: Observable<Response>): Observable<Response> { return observable.pipe( catchError( err => { if (err.status == 401) { this.router.navigateByUrl('/login'); return EMPTY; } else { return throwError(err); } }) ); }是一个异步函数。您以这种方式尝试过吗？

checksum.genchecksum

在vuejs中传递道具数据

1 个答案: