In the docs, the following example for <q-context-menu> is provided:
<div ref="target" style="height: 100px; width: 100px; background-color: purple">
<q-context-menu ref="context">
<q-list link separator style="min-width: 150px; max-height: 300px;">
<q-item @click="showToast(), $refs.context.close()">
<q-item-main label="Label" sublabel="Value"></q-item-main>
</q-item>
<q-item @click="showOtherToast(), $refs.context.close()">
<q-item-main label="Other Label" sublabel="Other Value"></q-item-main>
</q-item>
</q-list>
</q-context-menu>
</div>
However, I cannot figure out how to open the context menu.
EDIT: I got it!! I had to wrap the q-context-menu in a div with ref=“target”. Then right clicking on the div opens the context menu. I changed the code above to reflect the solution.