VUE项目爬坑---1、

VUE项目爬坑---1、

一、总结

一句话总结：

还是要多看视频，而且系统且轻便，比参照博客效果好

1、vue上一开始就要获取ajax数据的的函数（比如获取轮播图数据）应该放在哪个生命周期函数中？

放在created中

2、在组件中，使用v-for循环的话，一定要指定key？

在使用v-for的时候，尽量使用key

3、overflow x用来解决单页面切换动画时左右滚动条问题？

可以直接把overflow-x设置为hidden

4、左右对齐可以用弹性布局？

指定弹性布局和justify-content的值为space-between

<style lang="scss" scoped>
.mui-table-view {
  li {
    h1 {
      font-size: 14px;
    }
    .mui-ellipsis {
      font-size: 12px;
      color: #226aff;
      display: flex;
      justify-content: space-between;
    }
  }
}
</style>

5、vue中获取url中传递过来的路由参数？

id: this.$route.params.id, // 将 URL 地址中传递过来的 Id值，挂载到 data上，方便以后调用

<script>
// 1. 导入 评论子组件
import comment from "../subcomponents/comment.vue";

export default {
  data() {
    return {
      id: this.$route.params.id, // 将 URL 地址中传递过来的 Id值，挂载到 data上，方便以后调用
      newsinfo: {} // 新闻对象
    };
  },
  created() {
    this.getNewsInfo();
  },
  methods: {
    getNewsInfo() {
      // 获取新闻详情
      this.$http.get("api/getnew/" + this.id).then(result => {
        if (result.body.status === 0) {
          this.newsinfo = result.body.message[0];
        } else {
          Toast("获取新闻失败！");
        }
      });
    }
  },
  components: {
    // 用来注册子组件的节点
    "comment-box": comment
  }
};
</script>

6、在vue项目中，一些插件初始化的时候，会有开始没有效果，刷新之后有效果，如何解决？

应该把初始化插件的代码放到vue的mounted方法中，这个时候页面结构已经初始化好了

7、vue中如果要操作元素，最好的mounted方法中？

因为这个时候dom元素时最新的，比如初始化拆件

8、弹性布局实现上下两端对齐？

1、改变弹性布局主轴方向：display:flex;flex-direction:column;

2、两端对齐：justify-content:sapce-between;

二、内容在总结中

博客对应课程的视频位置：