javascript - 如何使用 mailto : link? 发送电子邮件正文中的 JSON 对象数组

Question

今天我一直用头撞 table 。我尝试让人们使用 mailto 链接直接通过电子邮件下订单(使用购物车)，而不是处理表单/API。 我的数据如下所示:

[
  {
    "image": "https://static.wixstatic.com/awefawef.jpg",
    "name": "xyz",
    "price": "20.00",
    "id": "3",
    "quantity": 30
  },
  {
    "image": "https://static.wixstatic.com/media/aweawfefeaw.png",
    "name": "abc",
    "price": "20.00",
    "id": "4",
    "quantity": 20
  }
]

尝试让电子邮件成为包含名称、价格和数量的表格，或者只是某种简单的列表/发票，例如:

所需元素:

 - name: abc 
quantity:30 
price:  $600 

- name: xyz 
quantity: 20 
price: $400
- Total Price: $1000

customer name: [insert name]
customer email: [insert email]
customer company: [insert company]

我正在努力以某种可用的形式解析 mailto 链接中 body 的数据。这是我到目前为止所得到的(这是在 React 中)...购物车数组是 this.state.cart :

 sendEmail(){

        let body;

        this.state.cart.forEach(function(element) {
            //console.log(element);
            body = 'name:' + element.name;
            body += '\nprice:' + element.price;
            body += '\nquanity:' + element.quantity;
            body += '\ntotal:' + element.quantity * element.price;
        });

    window.location.href="mailto:<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="91e2f0fdf4e2d1f4fcf0f8fdbff2fefc" rel="noreferrer noopener nofollow">[email protected]</a>?subject= Order for [Insert Name]&body=" + encodeURIComponent(body)

    }

这种方法可行，但我不知道如何以有序的方式获取所有这些。只有最后一个有效。它还会在 native Mac 邮件应用程序中打开。正如你所见，我有点转变了。

Answer 1

这是否达到了预期的结果？

function sendEmail() {

// Format a string itemising cart by mapping elements to sub-strings and joining the result
const items = this.state.cart.map(function(element) {
    return `
    - name ${ element.name }
    price: $${ element.price.toFixed(2) }
    quantity: ${ element.quantity }
    total: ${ (element.quantity * element.price).toFixed(2) }
    `;
}).join('\n');

// Calculate total price via reduction, and format to a number to 2dp
const totalPrice = this.state.cart.reduce(function(sum, element) {
    return sum + (element.quantity * element.price);
}, 0.0).toFixed(2);

// Format body string with itemised cart, total price, etc
const body = `
${ items }

Total Price: $${totalPrice}

customer name: [insert name]
customer email: [insert email]
customer company: [insert company]
`;

window.location.href = 'mailto:<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f88b99949d8bb89d95999194d69b9795" rel="noreferrer noopener nofollow">[email protected]</a>?subject=Order for [Insert Name]&body=' + encodeURIComponent(body);
}