JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.3/vue.min.js"></script>
<div id="app">
  <textarea v-model="input" @keypress.prevent.enter="onEnter"></textarea>
</div>

CSS

* {
  font-size: 16px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: BlinkMacSystemFont, -apple-system, Segoe UI, Roboto, Open Sans, Helvetica Neue, Arial, sans-serif;
}
textarea {
  width: 100%;
  height: 100vh;
  border: 0;
  outline: none;
  padding: 15px;
}
#app {
  display: flex;
  width: 100%;
}

JavaScript

new Vue ({
	el: '#app',
	data: {
		input: 'hello, world!!',
	},
  methods: {
		onEnter(e) {
			const pos = e.target.selectionEnd;
			this.input = this.input.slice(0, pos) + ' \n' + this.input.slice(pos);
			this.$nextTick(() => e.target.selectionEnd = pos + 2);
		},
	},
});