<button> issue inside component

[shohaxx]

Vue.js version

2.0.1

Reproduction Link

https://jsfiddle.net/3babq604/3/

Steps to reproduce

What is Expected?

What is actually happening?

do not shows button element in browser chrome 53.0.2785.143 m

[marceloadsj]

Your template must have only one root element.

<template id="counter-template">
  <div>
    <h4>counter</h4>
    <button>xxxxxxx</button>
  </div>
</template>

[marceloadsj]

Or, if you want "one or another" (h4 or button), the dev branch already have this feature.

<template id="counter-template">
  <h4 v-if="yourCondition">counter</h4>
  <button v-else>xxxxxxx</button>`
</template>

#3887

:)

[shohaxx]

@marceloLiberton but why it works on Internet explorer 11 ?

[rajibahmed]

This is not a bug ! You need a root element for your template ( vue2 works like reactjs)

Without the root component it can not render it properly.

<template id="counter-template">
  <div>
  <h4>counter</h4>
  <button>xxxxxxx</button>
  </div>
</template>

If you see anything is not working try the forum, docs first ...

If it is working on IE 11 maybe, IE is buggy.

//Best

[rekateka]

Hi @Abdulkhamidov, as @marceloLiberton and @rajibahmed mentioned, this is because you have a fragment instance which is unsupported as of 2.0.