您当前的位置:网站首页>JS>Vue 的 render 方法中 h 是什么? 找JS教程就上ki4.cc (>^ω^<),vue,vue.js,js

Vue 的 render 方法中 h 是什么? 找JS教程就上ki4.cc (>^ω^<),vue,vue.js,js

2020年06月17日 投稿作者: 围观人数:31

JavaScript 开发者常用的 10 个技巧 找JS教程就上ki4.cc (>^ω^<)

我们知道,JavaScript 这门语言正在高速发展中,伴随着 ES2020,又有很多很棒的功能加入,老实说,您可以通过许多不同的方式编写代码。

如果你接触过vue一段时间了,那么你可能会遇到过 rendering 方法在你的app文件中 -- 在最新版本的 CLI 中它是一个默认值, 并且是在 main.js文件中:

new Vue({
 render: h => h(App)
}).$mount('#app')

或者是,如果你使用了 render 方法(函数),可能会使用JSX:

Vue.component('jsx-example', {
  render (h) {
    return <p id="foo">bar</p>
  }
})

或许你想知道,h 是用来干嘛的?它表示什么意思呢? h 代表的是 hyperscript 。它是HTML的一部分,表示的是 超文本标记语言:当我们正在处理一个脚本的时候,在虚拟DOM节点中去使用它进行替换已成为一种惯例。这个定义同时也被运用到其他的框架文档中。详情点击这里 Cycle.js。

在这个问题上,Evan 描述到:

Hyperscript 它本身表示的是"生成HTML结构的脚本"

缩写为 h 是因为它更容易去输入。 他还在 Frontend Masters 上描述了这一点 他的高级 Vue 研讨会 。

真的,你可以认为它是 createElement 的缩写。 这将是一个长长的形式:

render: function (createElement) {
  return createElement(App);
}

如果我们用 h 代替它,那么我们可以这样:

PHP实现daemon - 后端 找JS教程就上ki4.cc (>^ω^<)

TL;DR PHP实现守护进程可以通过 pcntl 与 posix 扩展实现。 编程中需要注意的地方有: 通过二次 pcntl_fork() 以及 posix_setsid 让主进程脱离终端 通过 pc

render: function (h) {
  return h(App);
}

...然后可以通过使用 ES6 缩短:

render: h => h (App)

Vue 版本最多需要三个参数:

render(h) {
  return h('p', {}, [...])
}
  • 第一种是元素的类型(这里显示为 p)。

  • 第二个是数据对象。 我们在这里主要包括:props, attrs, dom props, class 和 style.

  • 第三个是一组子节点。 然后,我们将嵌套调用并最终返回一个虚拟 DOM 节点树。

更深入的信息你可以在 Vue 指南 里找到。

名称 hyperscript 可能会让某些人感到困惑,因为 hyperscript 实际上是 一个库的名字(这些日子没有更新 ),它实际上有一个 小的生态系统。 在这种情况下,我们不是在谈论那个特定的实现。

希望能为那些感到困惑的人解决问题!

推荐教程:《JS》

以上就是Vue 的 render 方法中 h 是什么?的详细内容,更多请关注ki4导航其它相关文章!

JS 家的排序算法 - 前端 找JS教程就上ki4.cc (>^ω^<)

本文中的代码里一定会有某些bug或错误或语法不规范等问题是我自己无法发现的,所以敬请各位大神能够指出错误,因为只有在不断改错的道路上我才能取得长久的进步。

标签

版权说明
免责声明:本文文章内容由ki4导航网发布,但不代表本站的观点和立场,具体内容可自行甄别.