Tenho uma tabela dinâmica que atualiza de acordo com um array de objetos. Em uma das colunas dela quero colocar um dropdown com as ações possível(editar, deletar, etc). Mas o dropdown não funciona e não mostra nenhum erro no console. Esse é o botão do dropdown:
<ul :id="'dropdown'+index" class="dropdown-content">
<li><router-link :to="{name: 'update', params: {id: conta.id}}">Editar</router-link></li>
<li><a href="#" @click.prevent="pagarConta(conta)">Pagar</a></li>
<li><a href="#" @click.prevent="removerConta(index, conta)">Remover</a></li>
</ul>
<a href="#" class="dropdown-button btn" :data-activates="'dropdown'+index">Ações</a>
E esse é o código que coloquei no final do meu body:
<script type="text/javascript>
$('.dropdown-button').dropdown({
inDuration: 300,
outDuration: 225,
constrain_width: false, // Does not change width of dropdown to that of the activator
hover: true, // Activate on hover
gutter: 0, // Spacing from edge
belowOrigin: false, // Displays dropdown below the button
alignment: 'left' // Displays dropdown with edge aligned to the left of button
}
);
</script>