js获取canvas对象两种方式有啥不同？

请问以下两种方式获取canvas对象有啥不同？

<canvas id="canvas" ref="canvas" style="width: 200px; height: 150px; background-color: #ffff00;"></canvas>

第一种方式：

const el =this.$refs.canvas;

const ctx = el.getContext('2d');

第二种方式：

const.ctx = this.$element('canvas').getContext('2d');