如何在vue多重列表渲染里使用codePoinAt()

Question

new Vue({
    el:"#view",
    data:{
        dj:['基阿萨大大','留个脚印','空间和萨']
    }
})

<p id="view" v-for="i in dj">
    <a :href="['http://xxx/dict/' + i.codePointAt(c).toString(16)]" v-for="c in i">{{c}}</a>
</p>

需要在 <a> href里对每个字转成16进制值，但如上只能得到每行的第一个字的值，要如何才能实现第个字对应16进制的值呐？

例如：

<p>
    <a href="http://xxx/dict/57fa">基</a>
    <a href="http://xxx/dict/963f">阿</a>
</p>

Answer 1

<p id="view" v-for="i in dj" :key="i">
    <a style="display:block"
       v-for="(c,index) in i"
          :key="index"
          :href="['http://xxx/dict/' + i.codePointAt(c).toString(16)]"
          >{{ c }}</a
        >
</p>

Answer 2

你的字符不是c吗？i不是整个字符串吗？

Answer 3

<a :href="setHref(i,c)" v-for="c in i">{{c}}</a>

methods: {
    setHref(i,c) {
        return `http://xxx/dict/${i.codePointAt(c).toString(16)}`
    }
}

Answer 4

<a :href="setHref(i,c)" v-for="c in i">{{c}}</a>

methods: {
    setHref(i,c) {
        return ((i,c)=>{return `http://xxx/dict/${i.codePointAt(c).toString(16)}})(i,c)`
    }
}

盲测