title: Get row element form row.clicked event
body: <p>I'm using Table from Bootstrap Vue, and I'm trying to display row details when clicking on a row.</p>
  
  <p>I used <code>row-clicked</code> event as the doc said, but I don't find any row details with a <code>toggleDetails</code> method.
  So I don't even know how to open it and where <code>toggleDetails</code> come from.</p>
  
  <p>There is a way to open this details row with <code>row.clicked</code> event ?</p>
  
  <p>Or should I use another method to do this ?</p>
  
  <p>Do you have some clues ?</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>There is some code to illustrate a bit more my problem, there is my table with the details row.</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;b-table
    v-if="items"
    :items="items"
    :fields="fields"
    show-empty
    striped
    hover
    responsive
    empty-text="There is no messages to show"
    class="col-sm-12 col-md-10"
    @row-clicked="test"
  &gt;
    &lt;template
      slot="message"
      slot-scope="row"
    &gt;
      {{ row.item.message }}
    &lt;/template&gt;
    &lt;template
      slot="row-details"
      slot-scope="row"
    &gt;
      &lt;code&gt;{{ row.item.message }}&lt;/code&gt;
    &lt;/template&gt;
  &lt;/b-table&gt;
  </code></pre>
  
  <p>You can see the <code>row.clicked</code> event I use on the table, and then my methods where I'm trying to open the row details. It's a simple method with some console.log</p>
  
  <pre class="lang-js prettyprint-override"><code>methods: {
    test(item, index, event) {
      console.log(item, index, event);
    },
  },
  </code></pre>