• 遇到项目难点


    1.我给组件内的原生控件添加事件,怎么不生效了?

    官网介绍

    // 自定义组件的 v-model
    <base-checkbox v-model="lovingVue"></base-checkbox>
    
    Vue.component('base-input', {
      inheritAttrs: false,
      props: ['label', 'value'],
      computed: {
        inputListeners: function () {
          var vm = this
          return Object.assign({},
            this.$listeners,// 我们从父级添加所有的监听器
            {
              input: function (e) {
                vm.$emit('input', e.target.value)
              }
            }
          )
        }
      },
      template: `
        
      `
    })
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    // Vue 提供了一个 $listeners property,它是一个对象,里面包含了作用在这个组件上的所有监听器
    // v-on="$listeners" 将所有的事件监听器指向这个组件的某个特定的子元素
    <base-input v-on:focus="onFocus"></base-input>
    
    Vue.component('base-input', {
      inheritAttrs: false,
      props: ['label', 'value'],
      computed: {
        inputListeners: function () {
          var vm = this
          // `Object.assign` 将所有的对象合并为一个新对象
          return Object.assign({},
            // 我们从父级添加所有的监听器
            this.$listeners,
            // 然后我们添加自定义监听器,
            // 或覆写一些监听器的行为
            {
              // 这里确保组件配合 `v-model` 的工作
              input: function (event) {
                vm.$emit('input', event.target.value)
              }
            }
          )
        }
      },
      template: `
        
      `
    })
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36

    2. 我用了 axios , 为什么 IE 浏览器不识别(IE9+)

    那是因为 IE 整个家族都不支持 promise, 解决方案:
    npm install es6-promise
    // 在 main.js 引入即可
    // ES6的polyfill
    require("es6-promise").polyfill();
    
    • 1
    • 2
    • 3
    • 4
    • 5

    3. 为什么我的引入的小图片渲染出来却是 data:image/png;base64xxxxxxxx

    这个是 webpack 里面的对应插件处理的,对于小于多少 K 以下的图片(规定的格式)直接转为 base64格式渲染;

    具体配置在webpack.base.conf.js里面的rules里面的 url-loader,这样做的好处:在网速不好的时候先于内容加载和减少http的请求次数来减少网站服务器的负担。

    4. Vue SPA 没法做优化(SEO)!有解决方案么

    可以的,SSR(服务端渲染就能满足你的需求),因为请求回来就是一个处理完毕的 html,现在 vue 的服务端开发框架有这么个比较流行,如下Nuxt.js。

    5. Vue可以写 hybird App 么!

    当然可以,两个方向.

    codorva + nativescript
    Weex

    6. Vue可以写桌面端么?

    当然可以,有electron和node-webkit(nw); 我只了解过electron;

    electron
    electron-vue: Vue-cli 针对 electron 的脚手架模板

  • 相关阅读:
    测试踩坑 - 当已有接口(或数据库表中)新增字段时,都需要注意哪些测试点?
    php static延迟静态绑定
    linux时间编程
    什么是边缘计算?它为何如此重要?-天拓四方
    基于 arm64 Linux nanosleep 系统调用流程分析
    MySQL InnoDB引擎优势以及共享表空间扩容和日志文件详解
    【spark】第一章——Spark简介及环境配置
    农场管理小程序|基于微信小程序的农场管理系统设计与实现(源码+数据库+文档)
    vue3+ts 实现移动端拖拽交换位置
    01、spring入门简介
  • 原文地址:https://blog.csdn.net/formylovetm/article/details/134517520