@@ -256,7 +256,7 @@ this.$dialog.confirm(message, options)
256256// You can also set all your defaults at the point of installation.
257257// This will be your global configuration
258258
259- Vue .use (VuejsDialog, {
259+ Vue .use (VuejsDialog, { // use VuejsDialog.default if installing inside script tag
260260 html: true ,
261261 loader: true ,
262262 okText: ' Proceed' ,
@@ -371,69 +371,6 @@ let vm = new Vue({
371371
372372![ Vuejs Dialog Plugin] ( ./src/docs/img/custom-view.png?raw=true " Vuejs Dialog Plugin custom view demo ")
373373
374- ## What's next?
375- ### Custom components (coming soon!!!)
376-
377- ``` vue
378- /* File: custom-component.vue */
379- <template>
380- <div class="custom-view-wrapper">
381- <h2>Share this amazing plugin</h2>
382-
383- <div v-if="options.html" class="dg-content" v-html="messageBody"></div>
384- <div v-else="" class="dg-content">{{ messageBody }}</div>
385-
386- <ok-btn @click="share('share url')" :loading="loading" :options="options" :enabled="true">Share on facebook</ok-btn>
387- <ok-btn @click="share('share url')" :loading="loading" :options="options" :enabled="true">Share on twitter</ok-btn>
388- <ok-btn @click="share('share url')" :loading="loading" :options="options" :enabled="true">Share on linkedIn</ok-btn>
389- <cancel-btn @click="proceed()" :loading="loading" :options="options" :enabled="true">Maybe later!</cancel-btn>
390- </div>
391- </template>
392-
393- <script>
394- import DialogMixin from 'vuejs-dialog/js/mixins/dialog-mixin'
395-
396- export default {
397- mixins: [DialogMixin], // All dialog methods (proceed, cancel, etc), state variables (options, etc) and computed properties are included
398- methods: {
399- share(url) {
400- // popup share window
401- }
402- }
403- }
404- </script>
405-
406- <style scoped="">
407- button {
408- width: 100%;
409- margin-bottom: 10px;
410- float: none;
411- }
412- </style>
413- ```
414-
415- ``` javascript
416- import TestView from ' ./path/to/file/custom-component.vue'
417- const VIEW_NAME = ' my-view'
418-
419- let vm = new Vue ({
420- created () {
421- this .$dialog .registerComponent (VIEW_NAME , TestView)
422- },
423- methods: {
424- showCustomView (){
425- this .$dialog .alert (trans (' messages.html' ), {
426- view: VIEW_NAME , // can be set globally too
427- html: true ,
428- animation: ' fade' ,
429- backdropClose: true
430- })
431- }
432- }
433- })
434- ```
435- ...and you get your custom view
436- ![ Vuejs Dialog Plugin] ( ./src/docs/img/custom-view.png?raw=true " Vuejs Dialog Plugin custom view demo ")
437374
438375# License
439376
0 commit comments