Is it possible to have two different outcomes for result()
in Vue's computed
based on the element id?
For instance, I'd like to return a result with commas replaced by AND
for #and
, and another result with commas replaced by -
for #dash
.
https://i.stack.imgur.com/ekWUr.png
new Vue({
el: '#demo',
data() {
return {
target: '',
}
},
computed: {
result() {
//if it is going to #and
// return '`' + this.target.replaceAll(",", "` AND `") + '`' // If {{ result }} is #and
// if it is going to #dash
return '`' + this.target.replaceAll(",", "` - `") + '`' // If {{ result }} is #dash
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<p id="and">You Entered {{ result }}</p>
<p id="dash">You Entered {{ result }}</p>
<input v-model="target" placeholder="Enter Your Target" />
</div>