JavaScript 编程精解中文第三版文件(超清晰)
本书包括三个部分。前十二章讨论 JavaScript 语言本身的一些特性。接下来的 8 章讨论网页浏览器和 JavaScript 在网页编程中的实践。最后两章专门讲解另一个使用 JavaScript 编程的环境
文件:(访问密码:551685)
以下内容无关:
-------------------------------------------分割线---------------------------------------------
component 动态组件 Vue官网上提供了一个动态组件 ,那么这里的 is 到底是什么呢? 官网介绍的太分散了,这里尽量全面的列举出来。如果有遗漏欢迎补充。
原生HTML 这是div input、select 这些 HTML 自带的都是可以的,div这些也可以。
全局组件 最常见的全局组件,就是各种UI库了,他们会用插件的方式被注册成为全局组件,所以我们可以直接使用el-input这类的标签。
局部组件 需要先在 组件的 components: { test } 部分注册组件,然后就可以用了。
异步组件 <component :is=“defineAsyncComponent(()=>import(’./components/test’))” str=“局部注册的组件”
这种方式就不需要在组件的 components 里面注册了,可以直接使用。可以实现真按需加载。
如何动态? 看了上面的例子你可能会奇怪,直接使用标签不香吗?干嘛非要用这个动态组件? 动态组件有几个好处:
动态加载、动态改变组件类型,比如官网里的例子, 改变tab就改变了组件。
遍历
const dict = { 101: input, 102: el-input, 103: test, 104: defineAsyncComponent( () => import(./components/test) ) } 这个是我最喜欢的一种用法,封装表单控件(的子控件)就非常方便了。 另外还可以实现表单的自定义子控件,比如加一个 105:你自己写的一个组件,这样就可以扩展子控件了。属性怎么办? 不同类型的组件,需要的属性也是不一样的,那么遍历的时候如何给组件的属性赋值?
这个可以使用 v-bind="{}" 的方式来实现,把需要的属性做成一个对象就好。
事件还没想好,目前只能是统一事件。 插槽也可以支持,只是需要做一下判断。
异步组件 defineAsyncComponent 加载 xx.vue 文件: defineAsyncComponent( () => import(’./components/test.vue’) ) 我怀疑 VueRouter 就是用 defineAsyncComponent 来实现 异步路由的。
加载 xx.js 文件: defineAsyncComponent( () => import(’./components/test.js ) ) js文件的内容可以是这样的。
test.js
export default { name: ‘component-test’, template: <div> <br> 这是 组件测试<br> 父组件传递参数:{ {str}}<br> setup 获取参数:{ {str1}}<br> </div>, props: { str: String }, setup(props) { // 在setup里面获取参数值 let str1 = Vue.ref(props.str) str1.value += ‘–内部改一下。’
return { str1 }
} } 我的在线演示用的都是这种方式,用来做演示还是很方便的。
template 模板,设置HTML部分。 其他的地方和 .vue 文件是一样的,当然css除外,还没想出了怎么解决css 的问题,因为不会。。。
动态组件的演示