常用

vue的优缺点

1.性能高 效率高

2.简单易用

3.前后端分离

4.它不适于seo优化 封装的比较厉害 适合中小型项目

5.不支持低版本的浏览器，最低IE9;

6.首屏加载耗时长，加载整个项目的css/js(可优化)

什么是mvvm

1.model 数据层

2.view 视图层

3.viewModel 根据 model 来更新view 是同步model和view的对象(桥梁)

mvvm 和mvc的区别

1.都是一种设计思想

2.mvc是操作dom来更新ui

3.mvvm是操作数据来更ui

v-show v-if

1.v-show改变的是css的display属性

2.v-if是改变dom是否渲染

3.应用场景: 如果要频繁的显示和隐藏 用v-show 否则使用v-if

v-for 与 v-if 的优先级

v-for的优先级比v-if高。

说出至少 4 种 vue 当中的指令和它的用法

v-if(判断是否隐藏)

v-for(把数据遍历出来)

v-bind(绑定属性)

v-model(双向绑定)

父子组件传递数据

1.父向子传递

<Child :msg='num' />(num是定义在父组件的data中的数据)

子组件

props: ['msg']

props: {

  msg: {

    required: true,

    type: Number,

    default: 0

  }

}

2.子向父传递

子组件

通过$emit  <button @click='deliverMsg' ></button>

deliverMsg () {

    childMsg 为父组件调用子组件上定义的方法名字

    this.$emit('childMsg','传递的数据')

}

父组件

<Child @childMsg='getChildMsg'/>

getChildMsg(msg) {

  console.log(msg); // 传递的数据

}

父子组件调用事件

方法一
this.$parent.事件名()  子调父

方法二(子调父的方法)

父组件

<child @fatherMethod="fatherMethod"></child>

fatherMethod() {

console.log('测试');

}

子组件

<button @click="childMethod()">点击</button>

childMethod() {

this.$emit('fatherMethod');

}

方法三(父调子的方法)

父组件

<child ref="child"></child>

click() {

  this.$refs.child.$emit('childMethod','发送给方法一的数据') // 方法1:触发监听事件

  this.$refs.child.callMethod() // 方法2:直接调用

},

子组件

export default {

    mounted() {

        this.monitoring() // 注册监听事件

    },

    methods: {

        monitoring() { // 监听事件

            this.$on('childMethod', (res) => {

                console.log('方法1:触发监听事件监听成功')

                console.log(res)

            })

        },

        callMethod() {

            console.log('方法2:直接调用调用成功')

        },

    }

}

生命周期

beforeCreate

created

beforeMounte

mounted

beforeUpdate

updated

beforeDestroy

destroy

第一次页面加载调用的钩子函数

beforeCreate

created

beforeMounte

mounted

vue.js的两个核心是什么？

数据驱动和组件化。

vue 的双向绑定的原理是什么

  vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的

vue常用的修饰符

v-model.number="age"

v-on:click.stop="doThis"

v-on:submit.prevent="onSubmit"

等等

vue中key值的作用

key的作用主要是为了高效的更新虚拟DOM。

另外vue中在使用相同标签名元素的过渡切换时，也会使用到key属性，其目的也是为了让vue可以区分它们

vue的动态组件。

  多个组件通过同一个挂载点进行组件的切换，is的值是哪个组件的名称，那么页面就会显示哪个组件。

  主要考查这 component的 is属性。