如何从 vue.js 数据中获取一个值到另一个数据参数中

How to grab a value from vue.js data into a another data parameter

本文关键字:数据 一个 参数 另一个 vue js 获取      更新时间:2023-09-26

我正在使用 vue.js 和 vue-qrcode我将一些用户数据存储在本地存储中并正确获取。

<template>
    <div class="row" style="100%;">
        <div class="center-block" style="width:200px">
            <qrcode :size="size" :val="val"></qrcode>
        </div>
    </div>
    {{content.last}}
</template>
<script>
    import store from '../store'
    var content = [];
    export default {
        data() {
                return {
                    content: store.todoStorage.fetch(),
                    size: 250,
                    fgColor: '#007a33',
                    bgColor: '#ffc72c',
                    val: "BEGIN:VCARD'r'nVERSION:2.1'r'nN:john;doe'r'nFN:asd " + content.last + "'r'nTEL;TYPE=cell:234'r'nEMAIL;PREF;INTERNET:234234'r'nEND:VCARD"
                }
            },
            components: {
                qrcode: VueQr
            },
    }
</script>

我尝试将字符串放入模板中,它在哪里工作,但是,QR 不知何故格式不正确。如果我删除变量并在 data() val 模型中仅使用文本,QR 是完美的并且它可以工作。但是,我需要从上面的内容模型中获取 4 个值。

如果不看到整个 Vue 应用程序,很难分辨。这是肯定的,您不能在对象中使用content.last val因为它是未定义的。基本上,您是在它存在之前分配它。计算对象应该会有所帮助。

像这样:

computed: {
  val() {
    var content = store.todoStorage.fetch();
    return "BEGIN:VCARD'r'nVERSION:2.1'r'nN:john;doe'r'nFN:asd " + content.last + "'r'nTEL;TYPE=cell:234'r'nEMAIL;PREF;INTERNET:234234'r'nEND:VCARD"
  }
}

同样,不确定这是否会在不看到您的代码的情况下解决,但它可能会让您走上正确的道路。