javascript - 关于vue指令的执行顺序和页面流程的疑问
PHP中文网
PHP中文网 2017-04-10 18:09:30
[JavaScript讨论组]

目的

为了给页面按钮增加权限控制,所以想到使用到vue里面的terminal

xxx.vue



directive

'use strict'

import Vue from 'vue'
var FragmentFactory = Vue.FragmentFactory
var remove = Vue.util.remove
var createAnchor = Vue.util.createAnchor

export default {
  priority:0,
  terminal: true,
  bind: function () {
    var container = document.getElementById(this.arg)
    debugger
    this.anchor = createAnchor('v-inject')
    container.appendChild(this.anchor)
    remove(this.el)
    var factory = new FragmentFactory(this.vm, this.el)
    this.frag = factory.create(this._host, this._scope, this._frag)
    this.frag.before(this.anchor)
  },
  unbind: function () {
  }
}

v-auth这个指令已经注到全局了,所以别问我为啥没引用。指令的内容直接拷贝的官网例子(原文),但是运行报错。所以断点调试

如上图是没有这个id的,查看网页dom发现文档里面什么都没有

结合自己对生命周期理解,我这边猜想上面这个

应该不属于spa中的元素吧?因为在组件编译的时候是不会再dom文档中有内容的,也就是官网的例子给一个思路其实不能用于特定的场景。

PHP中文网
PHP中文网

认证0级讲师

全部回复(1)
ringa_lee

v-auth:model 的冒号错了, 如果你是直接复制的话.

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号