点击div任意一处触发其中的单选按钮

原本的单选按钮只能点击那个小圆才能触发，现在需求点击按钮所在的div就触发单选按钮。
这是一次vue开发的需求，但可以举一反三到其他开发当中去。

原来的效果：

原来的代码：

<div class="tempStyle">
      <input class="hy-radio" type="radio" name="a"><label>选项1label>
    div>
    <div class="tempStyle">
      <input class="hy-radio" type="radio" name="a"><label>选项2label>
    div>

现在的效果：

现在的代码：
html：

<div class="tempStyle" @click="checked($event)">
      <input class="hy-radio" type="radio" name="a"><label>选项1label>
    div>
    <div class="tempStyle" @click="checked($event)">
      <input class="hy-radio" type="radio" name="a"><label>选项2label>
    div>

js:

重点是 $event vue可以通过这个来获取到当前元素，子元素，父元素。

解决的方案就是获取单选按钮所在的div元素，然后再这个div中添加点击事件，触发子元素，也就是单选按钮的点击事件。
这里面使用的是vue，再点击事件中添加参数$event就可以非常容易的获取到当前元素和子元素了。
VUE欧力给！?