tuax / tua-mp Goto Github PK
View Code? Open in Web Editor NEW🖖一款类 Vue 的渐进式小程序框架(A progressive miniprogram framework for coding like Vue)
Home Page: https://tuateam.github.io/tua-mp/
License: MIT License
🖖一款类 Vue 的渐进式小程序框架(A progressive miniprogram framework for coding like Vue)
Home Page: https://tuateam.github.io/tua-mp/
License: MIT License
使用数组的 __proto__
,而不是修改每一个数组数据的方法
$on(eventName)
监听事件(实现模板编译后再解决)$emit(eventName, optionalPayload, myEventOption)
代替 triggerEvent('myevent', myEventDetail, myEventOption)
触发事件.d.ts
声明文件目前没有处理原生 setData,导致直接跑旧代码的时候不绑定这些数据,其实可以代理一下原生的 setData...
当data 里时时object时 在computed里
得到这种形式的
{__TUA_PATH__: "c", __dep__: Dep}
这样比如我在data 定义一个Date 就在computed里无法操作其中的方法
export default {
data() {
return {
date: Date.now(),
g: new Date(),
b: new Object(),
c: {
a: 1
}
}
},
computed: {
now () {
console.log(this.g.now, this.b, this.c);
return new Date(this.date);
}
}
}
this.arr = [{ msg: 123 }] // 虽然数组改变了,但是没有观察这个数组
this.arr[0].msg = 'new val' // 无法触发 setter
同理替换对象也没有被观察,修复的话只需要在 defineReactive 中调用 observeDeep 观察新值即可。
修复新插入数组的嵌套数据不被观察的问题
修复调用改变原始数组的方法,数组下标被改变时,setter 中绑定的还是原始下标的问题
新建使用 webpack 打包源码的项目例子
支持各种 css 预处理器
因为在标准写法中触发了 setter,所以在传入数组和基本类型时没写对应的 observer 触发 setter,问题不大补上就好了...
目前的组件都放在 src/comps/ 下,但其实一些组件非公用,应该放在自己的 pages/ 文件夹下。
利用 lerna 合并相关项目...
小程序的有些组件在使用时会有数据不一致的情况:
例如 swiper 组件,在左右滑动后,current 的值就与实际值不一致。还有 scroll-view 组件中的 scroll-into-view。
然鹅,代码里对于新旧值相同的 setter 进行了错误拦截,导致 setter 失效...
把这行删掉就好...
json 要多恶心有多恶心 yaml 多好
功能支持列表:
computed: {
aDouble: vm => vm.a * 2
}
computed: {
// 读取和设置
aPlus: {
get: function () {
return this.a + 1
},
set: function (v) {
this.a = v - 1
}
}
}
实现依赖收集,这样就不会在每次 data 数据更新的时候重新计算整个 computed,进一步提高性能
问题
当前虽然已有默认模板,但是假如升级模板就必须升级包。
方案
因此打算支持项目级别的自定义模板功能。在没有配置文件时,使用内置默认模板。
tua.config.js
,没有时再找 tua-mp.config.js
templateDir
,即所有模板文件夹的路径,默认值为 .templates
。module.exports = {
templateDir: 'some/path',
}
eject
命令将默认模板导出$ tuamp eject
# OR
$ tuamp e
指定模板下次再做吧...
add
命令新增 -t, --template
选项,用于指定模板$ tuamp add api --template=<template> <name>
$ tuamp add page -t=<template> <name>
$ tuamp add comp -t=<template> <name>
$ tuamp add comp -t=<template> -g <name>
功能支持列表:
有没有办法可以就只写vue文件 来生成组件
重复写文件很烦
例如在 watch 中触发 setter,那么由于同步触发函数,同步清空状态,导致新的状态也被误清空了...
例如以下这种情况下 stringifyArr 不会更新
TuaPage({
data () {
return {
arr: [
{ c: { d: 'd0' } },
{ c: { d: 'd1' } },
1, 2, 3,
],
}
},
computed: {
stringifyArr () {
return JSON.stringify(this.arr, null, 4)
},
},
created () {
this.arr[0].c.d = 'new value'
}
并且 computed 初始化过早,少了 undefined 的步骤...
你的功能请求是否与某些问题相关?请描述
目前生成的 api 在编辑器中完全没有提示。
描述您想要的解决方案
index.d.ts
),这样在导入并调用接口时编辑器能够智能提示有哪些参数、是否必传。新增命令 declare
,读取导出的 apis 自动生成 index.d.ts
。
$ tuamp declare [apisPath]
# OR
$ tuamp d [apisPath]
apisPath
默认值为 src/apis/index.js
index.d.ts
生成在 apisPath
同级目录下由于使用 require
读取导出 apis 对象的文件,所以可能会碰到 alias
问题。例如项目中设置了 @
作为 ./src/
的别名。虽然 @tua-mp/cli
已内置了一些 alias
,但你仍然可以自由配置。
在 tua.config.js
中的 alias
选项会透传给 babel-plugin-module-resolver,例如将 foobar
指向 './src/foobar' 可以这么配置:
// tua.config.js
module.exports = {
alias: {
'foobar': './src/foobar',
},
}
响应的声明下个版本再规划
mock
属性,结合 json2ts,生成接口响应的声明。否则在调用 Object.keys 和 Object.entries 时会遍历出来...
因为在 observer 里用 Promise 异步触发更新,所以这个更新会覆盖 created/onLoad 中触发的 setter
Promise.resolve().then(function () {
this[name] = value
})
改成同步触发就行
this[name] = value
Cannot create property 'dep' on number '1'
因为是在重新观察后才继承,导致虽然根元素继承了依赖,但是子元素没有继承。
请问如何引入原生自定义组件? 谢谢
project.config.json 本来保存着编辑器的一些预定义的状态 现在被覆盖了
wepy 采用的是放在根目录模式
在 setData 前调用 beforeUpdate,在 setData 回调中调用 updated
这样就可以通用一些方法 变量 了
1.通过 webpack 将 Vue 风格的项目结构编译转换成小程序的项目结构
2.对于 node_modules
等依赖的打包
https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
将示例项目创建为代码片段,可以从网页上一键打开开发者工具查看
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.