h5移动端扫码，在微信浏览器中

先来看一下业务场景很简单，扫条形码识别条形码上的数据，填充到input中

代码实现1：

<a  href="javascript:window.open('//996315.com/api/scan/?redirect_uri=' + encodeURIComponent(location.href), '_self');">扫码</a>

代码实现2（推荐）：
encodeURIComponent里面使用项目的地址，多次重复扫描性能更好

<a  href="javascript:window.open('//996315.com/api/scan/?redirect_uri=' + encodeURIComponent('https://medical.geneth.com/#/hpvDetection'), '_self');">扫码</a>

点击扫码按钮，跳转到微信扫一扫，识别条形码数据后返回到此页面，在页面的onMounted周期里面获取数据

onMounted(() => {
  if (route.query.qrresult) {
    state.name = window.localStorage.getItem('name')
    state.sex = window.localStorage.getItem('sex')
    state.age = window.localStorage.getItem('age')
    state.phone = window.localStorage.getItem('phone')
    state.collectedDate = window.localStorage.getItem('collectedDate')
    state.sampleNo = route.query.qrresult.split(',')[1] // 条形码数据
  }
})

state.name = window.localStorage.getItem('name')
state.sex = window.localStorage.getItem('sex')
state.age = window.localStorage.getItem('age')
state.phone = window.localStorage.getItem('phone')
state.collectedDate = window.localStorage.getItem('collectedDate')

上面的这些数据是页面表单中要提交的数据，跳转到扫码页面后数据会丢失，我们可以在watch中进行监听，把数据先存在内存中，再在页面初始化的时候获取到就可以了，哈哈

watch(
  () => state,
  (val) => {
    window.localStorage.setItem('name', val.name)
    window.localStorage.setItem('sex', val.sex)
    window.localStorage.setItem('age', val.age)
    window.localStorage.setItem('phone', val.phone)
    window.localStorage.setItem('collectedDate', val.collectedDate)
  },
  { deep: true }
)