JavaScript如何使句子的标点符号单独占一行

这个标题可能说的不太明确，原谅词穷。

看图：

一个竖排的句子,正常渲染出来是这样的：

实际上想要的效果：

 

实现方法：使用replace、正则表达式

vue中：

            <li  v-for="(item, index) in data" :key="index">
                {{item.replace(/[,，\.。]/,(x,s)=>{
                    return '\r'+x;
                    })}}
            </li>