CODEWITHSUNDEEP
vue.jsvuejs2
jj008
jj008

Reputation: 1093

conditional within textarea tag

I'm trying to get the textarea to display some text as placeholder based on a conditional. activity() is a computed function that returns an object. What is the correct syntax for this?

<textarea
  v-model="feedback_text"
  placeholder={{ activity.feedback }} ? {{ activity.feedback }} : "Leave some formative feedback"
>

Upvotes: 0

Views: 288

Answers (1)

Feel The Noise
Feel The Noise

Reputation: 644

How about that?

<textarea 
    v-model="feedback_text"
    v-bind:placeholder='activity.feedback ? activity.feedback : "Leave some formative feedback"'
></textarea>

Demo:

var demo = new Vue({
    el: '#demo',
    data: {
        feedback_text: "",
        feedback_check: false
    },
    computed: {
        activity: function () {
          return this.feedback_check ? "You have checked that box" : false;
        }
    }
});
<script src="https://cdn.jsdelivr.net/npm/vue"></script>        
<div id="demo">
    <input type="checkbox" id="checkbox" v-model="feedback_check">
    <label for="checkbox">Test for computed changes</label>
    <textarea 
        v-model="feedback_text"
        v-bind:placeholder='activity ? activity : "Leave some formative feedback"'
    ></textarea>
</div>

Upvotes: 2

Related Questions