Vue—textarea控制输入行数（如最多输入6行）

今天在开发页面的时候，遇到一个限制文本域输入行数的，我用的是el-input，将type设置成textarea，就相当于HTML里的textarea标签了，去找了一下textarea的属性，仅有一个rows和cols来控制行和列，然写上之后的效果是控制多少行显示滚动条的，如图，我设置的是:rows="3"，也就是当我输入了3行之后，在输入就会出现右侧的滚动条，这并不是我想要的最多只能输入多少行。

按照我的想法是获取到文本域的行数进行判断的，如果rows大于6就不能在输入了，然而无论是网上搜到的还是自己写的都失败了，最后采用了watch监听的方式，通过\n可以监听到换行了多少，也就能获取到文本域有多少行，然后再进行判断就好弄了。我写的有点问题，最后还是找到了一个大神的文章才实现的（涉及一行代码的正则表达式，啊，我看不懂，不过实现我想要的效果就值得推荐，如有问题，请各位大神不吝赐教），效果如下：

我设置的是最多输入6行，为了测试方便，实际上我的需求是要20行的，提示信息不一致，我就不改了哈。附上代码：