Question

我正在尝试将对象属性传递给click事件。我知道您无法将大括号传递到html属性中，因为我正确输出了title属性。但是，在尝试呈现点击事件时该怎么做？

<p class="control" v-for="range in ranges">
    <a class="button is-outlined is-primary has-text-black" :title="range.title" @click="getNumber({{ range.id }})">{{ range.title }}</a>
</p>

invalid expression: expected property name, got '{' in

    getNumber({{ range.id }})

  Raw expression: @click="getNumber({{ range.id }})"

Answer 1

getNumber(`${ range.id }`)

应该做到这一点

Answer 2

请将@ click =“ getNumber（{{range.id}}）”“更改为@ click =” getNumber（range.id）“。 Vue在函数中有变量时对其进行了编译。

Answer 3

在v-for中添加键...然后将@ click =“ getNumber（{{range.id}}））”添加到@ click =“ getNumber（range.id）”

<p class="control" v-for="(range, key) in ranges" :key="key">
        <a class="button is-outlined is-primary has-text-black" :title="range.title" @click="getNumber( range.id )">{{ range.title }}</a>
    </p>

    methods: {
    getValueNumber(value){
    console.log(value)
    }
    }

@click函数调用中

3 个答案: