0

How can I bind values of buttons in Vuejs ? actually i am looking for something like:

<b-button-group>
     <b-btn value="one" v-model="stateButtons">one</b-btn>
     <b-btn value="two" v-model="stateButtons">two</b-btn>
     <b-btn value="three" v-model="stateButtons">three</b-btn>
</b-button-group>

<p>Chossen: {{stateButtons}}</p>  // show the value of selected button

2 Answers 2

1

You can do it like

<b-button-group>
     <b-btn value="one"  @click="stateButtons = "one">one</b-btn>
     <b-btn value="two" @click="stateButtons = "two">two</b-btn>
     <b-btn value="three" @click="stateButtons = "three">three</b-btn>
</b-button-group>
Sign up to request clarification or add additional context in comments.

Comments

0

Bootstrap button group doesn't allow any v-model attribute so you can do it manually like

  <b-button-group >
      <b-btn @click="stateButtons = 'one'">one</b-btn>
      <b-btn  @click="stateButtons = 'two'">two</b-btn>
      <b-btn @click="stateButtons = 'three'">three</b-btn>
    </b-button-group>

    <p>Chossen: {{stateButtons}}</p>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.