Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

不太会用 #19

Open
hi500 opened this issue Nov 18, 2019 · 1 comment
Open

不太会用 #19

hi500 opened this issue Nov 18, 2019 · 1 comment
Labels
question Further information is requested

Comments

@hi500
Copy link

hi500 commented Nov 18, 2019

必须要绑定一个click的function吗?如何传递参数?我理解能力差,使用文档能再详细和清楚一些吗?Thanks♪(・ω・)ノ大神

@l-hammer
Copy link
Owner

不是必须的,只有事件行为的埋点才需要绑定click修饰符。v-track主要是为了解决埋点代码和业务代码耦合的问题,不同类型的埋点都会有对应的修饰符。

至于传参,如下示例:一段业务代码,一段埋点代码,业务代码中的折叠面板组件提供了一个change的自定义事件,事件的回调接收一个当前激活面板名称的参数,同时上报一个id为18020的埋点事件。

<el-collapse
  v-model="activeName"
  v-track:18020.change="handleChange"
>
  <el-collapse-item title="反馈" name="Feedback">...</el-collapse-item>
  <el-collapse-item title="效率" name="Efficiency">...</el-collapse-item>
  <el-collapse-item title="可控" name="Controllability">...</el-collapse-item>
</el-collapse>

<script>
export default {
  data() {
    return {
      activeName: "Feedback",
    };
  },
  methods: {
    handleChange(val) {
      this.activeName = val;
    }
  }
}
</script>
import trackAction from "./action";

export default {
  /**
   * @param {Object} context 当前上下文(可以访问当前实例上的任何属性)
   * @param {Object} activeName 事件参数(即**当前激活面板名称**)
   * @param {Object} event 事件对象
   */
  18020(context, params) {
    const { activeName, $route: { name } } = context;
    // 这里的activeName其实就是params,因为我们在`handleChange`中做了赋值操作。
    trackAction("18020", {
      source_page: name,
      active_name: activeName
    });
  }
}

埋点需要的大部分参数都可以从实例data和事件本身接收的参数params中获取到,除此之外你也可以从store or 其它的数据状态管理中获取。这里有个建议:尽量从公用的地方读取参数,而不是从传递事件本身不需要的参数中获取。

如果还有困惑,可以描述下具体的需求及遇到的问题,最好能用codesandbox提供一个的在线的demo。

@l-hammer l-hammer added the question Further information is requested label Nov 19, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants