mirror of
https://github.com/tenrok/vue-context.git
synced 2026-05-17 05:39:36 +03:00
Randall Wilk
59 lines
1.5 KiB
HTML
59 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Vue Context Issue Test #4</title>
|
|
|
|
<style>
|
|
#div1 {
|
|
height: 50px;
|
|
background: #ff0000;
|
|
position: -webkit-sticky;
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 1020;
|
|
}
|
|
|
|
#div2 {
|
|
height: calc(100vh - 50px);
|
|
}
|
|
|
|
#div2 table {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
#div2 table td {
|
|
border: 1px solid #ddd;
|
|
padding: 0;
|
|
line-height: 1;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<div id="div1">
|
|
|
|
</div>
|
|
|
|
<div id="div2">
|
|
<table>
|
|
<tbody>
|
|
<tr v-for="item in items" @contextmenu.prevent="$refs.menu.open($event, item)">
|
|
<td v-text="item"></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<vue-context ref="menu">
|
|
<ul slot-scope="child" v-if="child.data">
|
|
<li @click="onClick(child.data)">Do something with: {{ child.data }}</li>
|
|
</ul>
|
|
</vue-context>
|
|
</div>
|
|
|
|
<script src="js/dist/test_issue_4.js"></script>
|
|
</body>
|
|
</html> |