时间戳

首页 > 解决方案 > 如何将字符串添加到变量中

javascript - 如何将字符串添加到变量中

问题描述

我需要为带有角度 7 的房屋内的新照明系统创建价格配置器。但是我用普通的 js 而不是 typescript + sass 对其进行编码。

第 1 页。用户选择他想要新建筑还是现有建筑.. Wifi/电线 [z1, z2...]

<label>New building</label>
<input type="radio" value="z1">

  1. 他应该选择建筑物内部的大小选项（=这将不同的控件集添加到第 3 页。）[-o1，-o2...]

     <select><option value="-o1">small</option>...

  2. 他想要建造的东西（灯、空调、探测器......可能是多个）（=在第 4 页添加一组不同的控件。或添加它们）[y8，y9...]

  3. 选择控件（android、tv、keychain、移动检测器）（可以是多个）[-5x2-24x2]
  4. 计算价格

我需要将这些值作为字符串添加到变量中，然后获取这个新变量并将价格分配给它。z1-o1-y8-i-5x2-24x2 > z1 = 新建筑，o1 = 小建筑，y8 = 灯（可以是多个选项 -> 空调，探测器..），i = 开/关 + 定时（可以是多个options -> on/off + dimming...) , 5x2 表示控制器类型“5”在此选项中将是两次，“24”也是两次。“5”的价格 = 1000 和 “24” = 2000。

我不知道我这样做是否正确。这很复杂。如何才能做到这一点？谢谢

标签： javascripthtmlcssangulartypescript

解决方案

如果每个选项都有价格，并且需要将价格相加，您可以这样做：

首先使用每个选项和相应的价格创建一个对象：

const prices = {
  z1: 4999
  z2: 7499
  o1: 13000
  ...etc
}

然后你可以创建一个包含所有选项的数组：

const options = ['z1', 'o1', 'y8', 'i', etc];

并通过像这样循环遍历数组来确定价格：

function determinePrice(options) {
  let price = 0;
  for (let option of options) {
    price += prices[option];
  }
  return price
}

如果你使用这种方法，我建议不要将 5x2 添加到选项中，只需添加 5 两次，它将被计算两次。

此外，要使其正常工作，您需要确保所有不同的页面都可以访问同一个数组，以便他们可以将用户选择的选项推送到同一个数组中。你如何做到这一点取决于你的项目结构，但你可以在这里寻找灵感：

角度组件交互

推荐阅读