Readability

[purepear]

I just can't understand how this

renderList() {
  return this.props.items.map((item, i) => {
    return <li key={i}>{item.name}</li>
  })
}

render () {
  const list = this.renderList()
  const content = list.length ? <ul>{items}</ul> : <p>No items found.</p>

  return (
    <div className='list-container'>
      {content}
    </div>
  )
}

can look more readable to some people than this

<template>
  <div class="list-container">
    <ul v-if="items.length">
      <li v-for="item in items">
        {{ item.name }}
      </li>
    </ul>
    <p v-else>No items found.</p>
  </div>
</template>

or this

<template lang="pug">
  .list-container
    ul(v-if="items.length")
      li(v-for="item in items") {{ item.name }}
    p(v-else) No items found.
</template>

The main thing i don't like in react is jsx. Such mish-mash. :)
Sadly i'll probably have to go back to react cause all of the hype and FB support made employers demand it (If i can't convince them to use Vue instead :)))

Also Vuex is the state manager if you compare things to MobX.. like the other issue comments :)