提交 46e6a1b2 编写于 作者: DCloud-yyl's avatar DCloud-yyl

调整INode为Element

上级 46a58a16
......@@ -35,8 +35,8 @@
return {
height: 0,
is_open: this.open as boolean,
boxNode: null as INode | null,
contentNode: null as INode | null,
boxNode: null as Element | null,
contentNode: null as Element | null,
};
},
watch: {
......@@ -51,8 +51,8 @@
$dispatch(this, 'UniCollapse', 'init', this)
},
mounted() {
this.boxNode = this.$refs['boxRef'] as INode;
this.contentNode = this.$refs['contentRef'] as INode;
this.boxNode = this.$refs['boxRef'] as Element;
this.contentNode = this.$refs['contentRef'] as Element;
// this.openCollapse(this.open)
},
methods: {
......
......@@ -24,7 +24,7 @@
methods: {
changeZIndex(zIndex : number) {
this.zIndex = 20;
(this.$refs['view'] as INode).style.setProperty('z-index', zIndex);
(this.$refs['view'] as Element).style.setProperty('z-index', zIndex);
}
}
}
......
......@@ -69,7 +69,7 @@ export default {
},
methods: {
validateGeneralAttributes() {
const generalTarget = this.$refs.get('general-target') as INode
const generalTarget = this.$refs.get('general-target') as Element
const generalId = generalTarget.getAttribute('id')
if (generalId != this.generalId) {
this.validateGeneralAttrText = '基础属性 id 验证失败'
......@@ -98,7 +98,7 @@ export default {
this.validateGeneralAttrText = '基础属性验证成功'
},
changeHeight(){
const generalTarget = this.$refs['general-target'] as INode
const generalTarget = this.$refs['general-target'] as Element
generalTarget.style.setProperty('height', '200px')
}
},
......
......@@ -233,11 +233,11 @@
},
methods: {
setCursor: function (cursor : number) {
(this.$refs['input'] as INode).focus();
(this.$refs['input'] as Element).focus();
this.cursor = cursor;
},
setSelection: function (selectionStart : number, selectionEnd : number) {
(this.$refs['input2'] as INode).focus();
(this.$refs['input2'] as Element).focus();
this.selectionStart = selectionStart;
this.selectionEnd = selectionEnd;
},
......
......@@ -55,7 +55,7 @@
},
methods: {
drawText() {
let node = (this.$refs['draw-text-view'] as INode)
let node = (this.$refs['draw-text-view'] as Element)
let ctx = node.getDrawableContext()
let width = node.getBoundingClientRect().width
ctx!!.reset()
......@@ -72,7 +72,7 @@
ctx!!.update()
},
drawLines() {
let ctx = (this.$refs['draw-line-view'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-line-view'] as Element).getDrawableContext()
ctx!!.reset()
ctx!!.lineWidth = 10;
......@@ -127,7 +127,7 @@
y += 15;
},
drawCircles() {
let ctx = (this.$refs['draw-circle-view'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-circle-view'] as Element).getDrawableContext()
ctx!!.reset()
// Draw shapes
for (var i = 0; i < 4; i++) {
......@@ -153,7 +153,7 @@
},
drawStar() {
let ctx = (this.$refs['draw-dash-line'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-dash-line'] as Element).getDrawableContext()
ctx!!.reset()
ctx!!.beginPath();
var horn = 5; // 画5个角
......@@ -224,7 +224,7 @@
return result
},
drawhouse() {
let ctx = (this.$refs['draw-house'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-house'] as Element).getDrawableContext()
ctx!!.reset()
ctx!!.lineWidth = 10;
......@@ -244,7 +244,7 @@
ctx!!.update()
},
drawPoint() {
let ctx = (this.$refs['draw-style'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-style'] as Element).getDrawableContext()
ctx!!.reset()
for (let i = 0; i < 6; i++) {
for (let j = 0; j < 6; j++) {
......@@ -263,7 +263,7 @@
ctx!!.update()
},
drawRect() {
let ctx = (this.$refs['draw-odd'] as INode).getDrawableContext()
let ctx = (this.$refs['draw-odd'] as Element).getDrawableContext()
ctx!!.reset()
// Create path
ctx!!.moveTo(30, 90);
......
......@@ -490,10 +490,10 @@
})
},
showPop: function () {
(this.$refs["pop"] as INode).style.setProperty("display", "flex")
(this.$refs["pop"] as Element).style.setProperty("display", "flex")
},
hidePop: function () {
(this.$refs["pop"] as INode).style.setProperty("display", "none")
(this.$refs["pop"] as Element).style.setProperty("display", "none")
},
stopClickPop: function (e : MouseEvent) {
e.stopPropagation() //点击到pop的非灰色区域,拦截点击事件
......
......@@ -65,7 +65,7 @@
// 触发整个日历的点击事件,需要计算点击位置
select(event : TouchEvent) {
const refs = this.$refs['draw-weeks'] as INode
const refs = this.$refs['draw-weeks'] as Element
const rect = refs.getBoundingClientRect();
const dom_x = rect.left; // 元素左上角相对于视口的 X 坐标
const dom_y = rect.top; // 元素左上角相对于视口的 Y 坐标
......@@ -139,7 +139,7 @@
// 绘制日历顶部信息
drawHeader() {
const refs = this.$refs['draw-header'] as INode
const refs = this.$refs['draw-header'] as Element
let ctx = refs.getDrawableContext()
if (ctx == null) return
const date_header_map = ['一', '二', '三', '四', '五', '六', '日']
......@@ -167,7 +167,7 @@
// 绘制日历主体
drawWeek(weeks : Array<Array<DateType>>, time : string) {
const start_time = Date.now()
const refs = this.$refs['draw-weeks'] as INode
const refs = this.$refs['draw-weeks'] as Element
let ctx = refs.getDrawableContext()
if (ctx == null) return
const dom = refs.getBoundingClientRect()
......
......@@ -26,8 +26,8 @@
lastY: 0, //上次
lastY2: 0, //
bAnimation: false, //是否动画
halfNode: null as INode | null,
scrollNode: null as INode | null
halfNode: null as Element | null,
scrollNode: null as Element | null
}
},
methods: {
......@@ -131,9 +131,9 @@
}
},
onReady() {
this.halfNode = this.$refs['halfScreen'] as INode;
this.halfNode = this.$refs['halfScreen'] as Element;
this.halfHeight = this.halfNode!.getBoundingClientRect().height;
this.scrollNode = this.$refs['halfScroll'] as INode;
this.scrollNode = this.$refs['halfScroll'] as Element;
this.totalHeight = uni.getWindowInfo().windowHeight;
this.halfNode?.style?.setProperty('top', this.totalHeight.toString());
......
......@@ -76,21 +76,21 @@
} as SwiperViewItem
] as SwiperViewItem[],
swiperIndex: -1,
$pageScrollView: null as null | INode,
$pageScrollView: null as null | Element,
$headerHeight: 0,
$animationFinishIndex: 0,
$tabScrollView: null as null | INode,
$indicatorNode: null as null | INode,
$tabScrollView: null as null | Element,
$indicatorNode: null as null | Element,
$swiperWidth: 0,
$swiperTabsRect: [] as SwiperTabsItem[]
}
},
onReady() {
this.$pageScrollView = this.$refs['pageScrollView'] as INode;
this.$headerHeight = (this.$refs['header'] as INode).offsetHeight
this.$swiperWidth = (this.$refs['swiper'] as INode).getBoundingClientRect().width
this.$tabScrollView = this.$refs['tabScroll'] as INode
this.$indicatorNode = this.$refs['indicator'] as INode
this.$pageScrollView = this.$refs['pageScrollView'] as Element;
this.$headerHeight = (this.$refs['header'] as Element).offsetHeight
this.$swiperWidth = (this.$refs['swiper'] as Element).getBoundingClientRect().width
this.$tabScrollView = this.$refs['tabScroll'] as Element
this.$indicatorNode = this.$refs['indicator'] as Element
this.cacheTabItemsSize()
this.setSwiperIndex(0, true)
},
......@@ -170,7 +170,7 @@
},
cacheTabItemsSize() {
this.$swiperTabsRect.length = 0
const tabs = this.$refs["swipertab"] as INode[]
const tabs = this.$refs["swipertab"] as Element[]
tabs.forEach((node) => {
this.$swiperTabsRect.push({
x: node.offsetLeft,
......@@ -260,4 +260,4 @@
.swiper-item {
flex: 1;
}
</style>
\ No newline at end of file
</style>
......@@ -37,7 +37,7 @@
stickyTop: 0,
stickyTran: 0,
scrollTop: 0,
stickyNode: null as INode | null
stickyNode: null as Element | null
}
},
methods: {
......@@ -70,11 +70,11 @@
onLoad() {
},
onReady() {
this.stickyNode = this.$refs['sticky'] as INode;
this.stickyNode = this.$refs['sticky'] as Element;
// let rect = this.stickyNode?.getBoundingClientRect();
// this.stickyTop = rect?.top;
//this.stickyTop = this.stickyNode?.getBoundingClientRect()?.top;
let rect = (this.$refs['sticky'] as INode).getBoundingClientRect();
let rect = (this.$refs['sticky'] as Element).getBoundingClientRect();
this.stickyTop = rect.top;
}
}
......
......@@ -45,8 +45,8 @@
return {
swiperList: [] as SwiperViewItem[],
swiperIndex: -1,
$tabScrollView: null as null | INode,
$indicatorNode: null as null | INode,
$tabScrollView: null as null | Element,
$indicatorNode: null as null | Element,
$animationFinishIndex: 0,
$swiperWidth: 0,
$swiperTabsRect: [] as SwiperTabsItem[]
......@@ -61,9 +61,9 @@
}
},
onReady() {
this.$tabScrollView = this.$refs['tabScroll'] as INode
this.$indicatorNode = this.$refs['indicator'] as INode
this.$swiperWidth = (this.$refs["swiper"] as INode).getBoundingClientRect().width
this.$tabScrollView = this.$refs['tabScroll'] as Element
this.$indicatorNode = this.$refs['indicator'] as Element
this.$swiperWidth = (this.$refs["swiper"] as Element).getBoundingClientRect().width
this.cacheTabItemsSize()
this.setSwiperIndex(0, true)
},
......@@ -104,7 +104,7 @@
},
cacheTabItemsSize() {
this.$swiperTabsRect.length = 0;
const tabs = this.$refs["swipertab"] as INode[]
const tabs = this.$refs["swipertab"] as Element[]
tabs.forEach((node) => {
this.$swiperTabsRect.push({
x: node.offsetLeft,
......
......@@ -39,7 +39,7 @@
return {
swiperList: [] as SwiperViewItem[],
swiperIndex: -1,
$tabScrollView: null as null | INode,
$tabScrollView: null as null | Element,
$animationFinishIndex: 0,
$swiperWidth: 0
}
......@@ -52,8 +52,8 @@
}
},
onReady() {
this.$tabScrollView = this.$refs['tabScroll'] as INode
this.$swiperWidth = (this.$refs["swiper"] as INode).getBoundingClientRect().width
this.$tabScrollView = this.$refs['tabScroll'] as Element
this.$swiperWidth = (this.$refs["swiper"] as Element).getBoundingClientRect().width
this.setSwiperIndex(0, true)
},
methods: {
......@@ -106,7 +106,7 @@
const min_ratio = 1
const max_ratio = 1.3
const tabs = this.$refs['swipertab'] as INode[]
const tabs = this.$refs['swipertab'] as Element[]
const current_node = tabs[current_index]!
const move_to_node = tabs[move_to_index]!
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册