小编Pie*_*her的帖子

我正在尝试实现类似松弛的功能,只有在按下确切输入时才会发送消息(没有按下移位)

考虑 <textarea type="text" v-model="message" @keyup.enter.exact="sendMessage($event)"></textarea> 使用此组件的此vue模板

export default {
  name: 'Typing',
  data() {
      return {
          message: null
      }
  },
  methods: {
      sendMessage(e) {
        // e.stopPropagation() and e.preventDefault() have no impact
        this.$socket.emit('message', { text: this.message });
        console.log(this.message); // Print the message with another '\n' at the end due to textarea default behavior
      }
  }
}

有没有人知道如何避免使用最后一个'\n'而不使用正则表达式删除它然后再发送到后端(我认为这将是脏的)？

谢谢

PS:我对VueJS堆栈很新,希望我的问题不明显

编辑:这个问题类似,但建议的解决方案不起作用

我正在尝试在Vue中实现CSS类型指示器。没有Vue，它看起来像这样：

.typing-indicator {
  background-color: #E6E7ED;
  width: auto;
  border-radius: 50px;
  padding: 20px;
  display: table;
  margin: 0 auto;
  position: relative;
  -webkit-animation: 2s bulge infinite ease-out;
          animation: 2s bulge infinite ease-out;
}
.typing-indicator:before, .typing-indicator:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: -2px;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background-color: #E6E7ED;
}
.typing-indicator:after {
  height: 10px;
  width: 10px;
  left: -10px;
  bottom: -10px;
}
.typing-indicator span {
  height: 15px;
  width: 15px;
  float: left;
  margin: 0 1px;
  background-color: #9E9EA1;
  display: block;
  border-radius: 50%;
  opacity: 0.4; …

我的商店中有一个RESET突变，将状态对象重置为其默认值：我找到的解决方案是Object.assign(state, defaultState)使它起作用而不是state = defaultState。=在特定属性上影响起作用，但对整个状态对象无效。

工作：

RESET: (state) => {
  Object.assign(state, defaultState);
}

不工作：

RESET: (state) => {
  state = defaultState;
}