2019-09-29 00:13:01 +08:00
|
|
|
# Mask Closable
|
|
|
|
```html
|
|
|
|
<n-button
|
|
|
|
size="small"
|
|
|
|
@click="isActive = true"
|
|
|
|
>
|
|
|
|
Start Me up
|
|
|
|
</n-button>
|
2019-11-14 19:22:35 +08:00
|
|
|
<n-modal v-model="isActive" :mask-closable="false">
|
2019-09-29 00:13:01 +08:00
|
|
|
<div style="background: #5C657EFF; padding: 24px; border-radius: 8px;">
|
|
|
|
<div>If you start me up, If you start me up, I'll never stop.</div>
|
|
|
|
<n-input v-model="inputValue" />
|
|
|
|
inputValue: {{ inputValue }}<br>
|
|
|
|
<n-button
|
|
|
|
size="small"
|
|
|
|
@click="isActive = false"
|
|
|
|
>
|
|
|
|
Close it
|
|
|
|
</n-button>
|
|
|
|
</div>
|
|
|
|
</n-modal>
|
|
|
|
```
|
|
|
|
```js
|
|
|
|
export default {
|
|
|
|
data () {
|
|
|
|
return {
|
|
|
|
isActive: false,
|
|
|
|
inputValue: ''
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|