最近在使用vue的过程中发现会出现一些特别多层次的一个任务递交，比如从组件的事件触发，到actions的提交，再到自己写的一个函数。 这样会出现大量的含义非常类似的函数，我对这些函数如果很好的命名有很大的疑惑。我即害怕语义化不足，又害怕层次感不够。

比如我在vue中的一个例子

// step 1 事件触发

<span class="clear" @click="clearHistory">

// setp 2 递交给actions处理

 clearHistory() {
      this.delHistory()
    },
    ...mapActions(['delHistory'])
    
// step 3 actions递交给某个函数来进行本地（localStorage）清空 并更新state数据

const delHistory = function({ commit }) {
  commit(types.SET_SEARCH_HISTORY, clearHistory())
}

这样会经历很多层次的任务递交，而这些任务又都可以取名为类似clearHistory/delHistory之类的名字。
那么如何建立起一种清晰，高可读，而又可以避免重复变量的命名方式呢?

是从函数具体行为的角度上去命名，还是从调用层次步骤的角度上去呢？

望解答，谢谢！