• Vue----全局组件和局部组件


    1.全局组件:组件的属性不能用大写字母组件的名字可以用驼峰命名法,但是使用的时候必须用连字符

    没有单文件组件时不能使用单标签(不会报错,但是只能使用一次 多次使用只显示第一个)

    注册的组件不要跟系统标签同名

    2.局部组件:一个vm实例可以有多个局部组件,但是只能供当前vm实例使用

    全局和局部组件举例(filter举例,不只filter只要是Vue里面的方法都是可以用的)

        <div id='app'>

            <p>{{msg|tool}}p>

            <p1>p1>

            <p2>p2>

        div>

        <script>

            // 全局:所有组件共同的功能(指令,过滤器,组件)

            Vue.filter("tool2",(str)=>{

                return "晚上好"+str

            })

            let p1={

                        template:`

                       

    {{msg|tool}}

                        `,

                        data(){

                            return{

                                msg:"hello",

                            }

                           

                        },

                        // 局部:只有当前组件拥有的功能(指令,过滤器,组件)

                        filters:{

                            tool(str){

                                return str+"预习"

                            }

                        }

                    }

                    let p2={

                        template:`

                       

    {{data|tool2}}

                        `,

                        data(){

                            return{

                                data:"666"

                            }

                           

                        },

                    }

            new Vue({

               

                el:'#app',

                data: {

                    msg:"6666"

                },

                methods: {},

                computed: {},

                watch: {},

                components:{

                    // 注册主键

                    p1,

                    p2

                },

                filters:{

                    tool(str){

                        return str+"hello"

                    }

                },

        })

        script>

  • 相关阅读:
    企业架构LNMP学习笔记33
    Java面试-轻松搞定Java面试集合相关题目
    Redis-带你深入学习数据类型list
    使用 COPY 加速 PostgreSQL 批量插入
    使用todesk或者向日葵远程Ubuntu22.04系统的客户机黑屏
    Docker Stack部署应用详解+Tomcat项目部署详细实战
    LocalDateTime、LocalDate、LocalTime相关使用记录(未完)
    [从零开始学习FPGA编程-54]:高阶篇 - 基于IP核的FPGA开发-PLL锁相环IP核的原理与配置(Altera)
    拼图游游戏代码
    spring:详解spring MVC
  • 原文地址:https://blog.csdn.net/cjx177187/article/details/126805261