遇到项目难点

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

官网介绍

js 复制代码
// 自定义组件的 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: `
    <label>
      {{ label }}
      <input
        v-bind="$attrs"
        v-bind:value="value"
        v-on="inputListeners"
      >
    </label>
  `
})
js 复制代码
// 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: `
    <label>
      {{ label }}
      <input
        v-bind="$attrs"
        v-bind:value="value"
        v-on="inputListeners"
      >
    </label>
  `
})

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

bash 复制代码
那是因为 IE 整个家族都不支持 promise, 解决方案:
npm install es6-promise
// 在 main.js 引入即可
// ES6的polyfill
require("es6-promise").polyfill();

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 的脚手架模板

相关推荐
打小就很皮...2 分钟前
ShowCountCard 功能迭代:新增周月对比属性,完善数据可视化场景
前端·react.js·信息可视化
IT_陈寒11 分钟前
Redis性能翻倍的7个冷门技巧:从P5到P8都在偷偷用的优化策略!
前端·人工智能·后端
Moonbit23 分钟前
MoonBit Meetup 丨 手把手带你走进 AI 编程新世代
前端·后端·程序员
携欢23 分钟前
PortSwigger靶场之 CSRF where token is not tied to user session通关秘籍
前端·csrf
HHHHHY1 小时前
使用阿里lowcode,手搓一个Carousel 走马灯容器组件
前端·react.js
用户352120195601 小时前
React-router v7
前端
Mintopia1 小时前
⚡ AI 时代,全栈 Next.js 开发的激情在哪里?
前端·aigc·全栈
Hello123网站1 小时前
300多个Html5小游戏列表和下载地址
前端·html·html5
Stringzhua1 小时前
ElementUi【饿了么ui】
前端·ui·elementui
HHHHHY2 小时前
http接口响应头类型不对,导致svg图片无法预览,前端解决方案
前端·javascript