How can I solve "Interpolation inside attributes has been removed. Use v-bind or the colon shorthand"? Vue.js 2

Use JavaScript code inside v-bind (or shortcut ":"):

:href="'#purchase-' + item.id"

and

:id="'purchase-' + item.id"

Or if using ES6 or later:

:id="`purchase-${item.id}`"

vue.js vuejs2 vue-component

If you're pulling data from an array of objects, you need to include require('assets/path/image.jpeg') in your object like I did below.

Working example:

people: [  {    name: "Name",    description: "Your Description.",    closeup: require("../assets/something/absolute-black/image.jpeg"),  },

Using require(objectName.propName.urlPath) in the v-img element did not work for me.

<v-img :src="require(people.closeup.urlPath)"></v-img>

vue.js vuejs2 vue-component

Use v-bind or shortcut syntax ':' to bind the attribute.Example:

<input v-bind:placeholder="title"><input :placeholder="title">

CodeHunter