demo.vue 1021 B

123456789101112131415161718192021222324252627282930313233
  1. <template>
  2. <div id="imagepreview">
  3. <nut-cell isLink title="展示图片预览" :showIcon="true" @click.native="showPreview = true"></nut-cell>
  4. <nut-imagepreview v-model="showPreview" :images="dataImgItem" @close="showPreview = false"/>
  5. </div>
  6. </template>
  7. <script>
  8. export default {
  9. data() {
  10. return {
  11. dataImgItem: [],
  12. showPreview: false
  13. };
  14. },
  15. mounted() {
  16. this.dataImgItem = [
  17. {
  18. imgSrc: '//m.360buyimg.com/mobilecms/s750x366_jfs/t1/18629/34/3378/144318/5c263f64Ef0e2bff0/0d650e0aa2e852ee.jpg'
  19. },
  20. {
  21. imgSrc: '//m.360buyimg.com/mobilecms/s750x366_jfs/t1/26597/30/4870/174583/5c35c5d2Ed55eedc6/50e27870c25e7a82.png'
  22. },
  23. {
  24. imgSrc: '//m.360buyimg.com/mobilecms/s750x366_jfs/t1/9542/17/12873/201687/5c3c4362Ea9eb757d/60026b40a9d60d85.jpg'
  25. },
  26. {
  27. imgSrc: '//m.360buyimg.com/mobilecms/s750x366_jfs/t1/30042/36/427/82951/5c3bfdabE3faf2f66/9adca782661c988c.jpg'
  28. }
  29. ];
  30. }
  31. };
  32. </script>
  33. <style lang="scss"></style>