• 关于

    dom_封装函数

    的搜索结果

回答

显然你这里写的是错误的:componentDidMount : function(){ this.props.flag_form? $(this).slideDown(200):$(this).slideUp(200); },这里的 this 是什么? 这里的 this 指的是你 HeaderForm 这个组件对象,组件对象是 React 生成的,并不是真实的一个 Dom 节点,你不能用 jQuery 来操作他,没有用的。想要直接操作 Dom 的话,在 React 0.14 中你可以给 render 的 form 设置一个 ref , 然后再通过 this.refs.formNode (formNode 是你给 form 设置的 ref),这个对象才是那个 form 的真实 dom 节点,你可以用 jQuery 给他封装一下然后就可以调用 jQuery 的方法了 。如果你用的是 0.13 的话,还要加个 getdDOMNode() 这个函数才能拿到真实的 Dom 节点。
小旋风柴进 2019-12-02 02:24:35 0 浏览量 回答数 0

回答

看了下 servo 中 dom 节点的处理方式,构造了个例子 use std::cell::{Cell, RefCell}; struct Element { flag: Cell<i32>, id: Cell<i32>, children: RefCell<Vec<RefCell<Element>>>, } impl Element { fn new() -> Element { Element { flag: Cell::new(0), id: Cell::new(1), children: RefCell::new(Vec::new()), } } fn add_child(&self, child: Element) { self.flag.set(self.flag.get() + 1); self.children.borrow_mut().push(RefCell::new(child)); } fn before_remove(&self) { self.flag.set(0); } fn after_remove(&self) { self.id.set(0); } fn remove_children(&self) { self.before_remove(); for e in self.children.borrow().iter() { e.borrow().remove_children(); } self.after_remove(); } } fn main() { let e1 = Element::new(); let e2 = Element::new(); let e3 = Element::new(); let e4 = Element::new(); let e5 = Element::new(); let e6 = Element::new(); let e7 = Element::new(); e6.add_child(e7); e5.add_child(e6); e4.add_child(e5); e3.add_child(e4); e2.add_child(e3); e1.add_child(e2); e1.remove_children(); println!("..."); } Element 中所有的字段用 Cell/RefCell 包装后,所有的成员方法都使用 &self 不可变借用来调用 remove_children 应该是能还原你原始的问题了。所有要嵌套/递归修改自己的地方都只用 borrow() 不可变借用就行。 而其他的基础类型字段,如 i32, vec 由于不会嵌套修改,可以 borrow_mut() 修改完马上还回来,保证一句话修改完就行。 children 我给简写了,实际上由于要再被其他人引用,应该在外面再包一层 Rc 的。 大致搜了下有类似需求的一些项目,处理方式都是类似这样的。 ######回复 @DogFeet :c++里,这些地方相对较少,而变更对象时,改其它对象是很多的,在有交互的代码里可以说是大量,成本不一样######回复 @templar : 不需要把每个修改都封装到单独的函数里面。至于说所有路径都测试到,C++也一样有这个问题,如果你在 Objects 的迭代中某个 object.update 中修改了 Objects 的布局,一样可能会导致迭代器出问题,这些只是你在 C++ 中习惯了,知道 update 中有些事情其实也是不能做的。######回复 @DogFeet : borrow_mut在运行中检查,实际中很难所有路径都测试到,所以rust还是太累了,暂时还是不用了,不过这个问题也算是有解决方法了,谢谢了######回复 @DogFeet : 那得很注意,把每个修改都封到单独的函数里,行是行,就是太费劲了~~~######回复 @templar : 转换成你那个例子就是 update 用 &self 调用,只需要 borrow 借用,update 中又一次借用自己也是用 borrow,由于 life 字段被 Cell 包起来了,所以可以通过 &self 修改。而多次 borrow 并不会有什么问题。这样就解决你原来的问题了。###### 已经用上rust了!  赞一个, ######用Recell+Mutex试下。###### 如果是多个线程要修改你的objects,则用Arc 如果只有一个线程多个地方要修改objects,则用Rc ######回复 @DogFeet : 搞不定~~求个示例代码。。。这个问题就是持有一个μt T的情况下,调用其成员函数,在该成员函数里,又需要修改自已或别的对象,就是也要获得μt T,在游戏服务器里,放技能这类逻辑,都会修改多个对象的属性###### @templar .而且用Rc了一般就不会再传引用了,你什么时候见过到处 &shared_ptr的。。。。。全局变量的问题,Rust是不推荐的,所以你要写传统语言中常见的单例模式会发现很难。###### @templar Rc没有你说的这种要求,都说了就是非线程安全版的shared_ptr######回复 @DogFeet : 看文档,rc是用于不可变量的,要获得μt还是得传入μt RC<T>,一层层往上推,又得全是μt,而且还要求rc是unique的,可能你说的可行吧,但现在暂时没什么兴趣了,写一个全局变量都这么费劲,哪天有精神了再弄吧,多谢回答######回复 @templar : Rc 就是用来解决你多个地方要共享修改一个元素的,等同于 C++ 非线程安全版 shared_ptr###### 引用来自“DogFeet”的评论 如果是多个线程要修改你的objects,则用Arc 如果只有一个线程多个地方要修改objects,则用Rc  #[derive(Debug)] pub struct OBJ {     x : i32, } fn main() {     let mut x1 = Rc::new(OBJ { x: 100 } );     let mut x2 = x1.clone();     x1.x = 101;     x2.x = 102;     println!("{:?}",x1);     println!("{:?}",x2); } src\main.rs(105,5): error : cannot assign to immutable field src\main.rs(106,5): error : cannot assign to immutable field std::rc::Rc A reference-counted pointer type over an immutable value. 要获得&mut T,还是需要 fn get_mut(rc: &mut Rc<T>) -> Option<&mut T>[−] Unstable Returns a mutable reference to the contained value if the Rc<T> is unique. Returns None if the Rc<T> is not unique. ###### 我想可能rust不适合其它语言那种N层嵌套调用,可能得写成比较扁平的类,Github上的开源,也大都如此,比如技能这个,可能就得把技能拉出来,跟OBJ同层,用RefCell只临时borrow_mut,不过这样又得导致很多其它的不便,也是挺恶心的 ###### fn main() { let x1 = Rc::new(RefCell::new(OBJ { x: 100 } )); let x2 = x1.clone(); x1.borrow_mut().x = 101; x2.borrow_mut().x = 103; println!("{:?}",x1); println!("{:?}",x2); } 所有使用你那个HashMap的地方拿到的都是一个类似上面的 x1, x2 的对象,不用保存引用,可变引用的哦,也不会传染到上层哦。 我比较好奇的是你的 get_global_objects () 打算怎么实现,要实现这种类似单例类会很麻烦的。 ######https://github.com/Kimundi/lazy-static.rs 这个宏可以简化全局变量######Global是有办法的,参照os.Stdout,比较烦一点,不过可以用宏实现######两次borrow_mut会panic的,在N层嵌套里,要想保持单一个borrow几乎不可能的,一个技能出发一个效果,影响N个对象,N个对象上的反应器又会触发其它效果,完全不可控,这个我在最上面说过不行######我说的两次borrow_mut会panic的,是指先持一个mut,调用其内部函数,在函数里,可能需要borrow自已,或其它对象,一层层函数调下去,需要borrow的对象是动态的,不可知的 你没仔细看我的问题 impl for OBJ { fn update(&mut self) { // 这里borrow另一个,可能是自已,或别人 // 假如那个对象已经被borrow了,就panic了 } } fn main() {     let x1 = Rc::new(RefCell::new(OBJ { x: 100 } ));     let x2 = x1.clone();       x1.borrow_mut().update()       println!("{:?}",x1);     println!("{:?}",x2); } ######不过RefCell可以解决HashMap的引用了,不必都用iter_mut了###### 引用来自“templar”的评论 我想可能rust不适合其它语言那种N层嵌套调用,可能得写成比较扁平的类,Github上的开源,也大都如此,比如技能这个,可能就得把技能拉出来,跟OBJ同层,用RefCell只临时borrow_mut,不过这样又得导致很多其它的不便,也是挺恶心的 如果你能做到扁平的,那就可以直接用 &, &mut 来borrow了,用完直接还掉,就没上面的问题了呀。 但事实上很难做到的,我也是做游戏的。比如常见的触发器需求,有时候触发器关联了2个对象,这个触发器需要引用这2个对象吧,C++可能就直接用到智能指针了(有的解决方案是用ID做句柄,不过也有麻烦的地方,要手动解除ID的关联,除非能保证ID不回环)。 所有的对象都被 Objects borrow 了,触发器再 borrow 肯定要出事,这种需求很难通过做平来避免的。######打包成事件扔到顶层循环处理,会勉强可以,不过很不自然,会导致别的问题###### 引用来自“templar”的评论我说的两次borrow_mut会panic的,是指先持一个mut,调用其内部函数,在函数里,可能需要borrow自已,或其它对象,一层层函数调下去,需要borrow的对象是动态的,不可知的 你没仔细看我的问题 impl for OBJ { fn update(&mut self) { // 这里borrow另一个,可能是自已,或别人 // 假如那个对象已经被borrow了,就panic了 } } fn main() {     let x1 = Rc::new(RefCell::new(OBJ { x: 100 } ));     let x2 = x1.clone();       x1.borrow_mut().update()       println!("{:?}",x1);     println!("{:?}",x2); } 你说的这个我还没考虑到。 如果是这样,那确实很麻烦,按照多人共享用 Rc 的策略,如果 Objects 中的 entry 也需要多人共享,那把 entry 也用 Rc 包起来?不过这样,entry.update(&mut self) 就得改写成 entry_update(e: Rc<...>) 了,这样也确实很丑。 或者是模仿 Rc, Arc 这种用 unsafe 包装内部可变性的方式,把 entry 的 update 用 unsafe 包起来,外面拿 immutable borrow 的 entry 也能通过调用其成员函数来做到修改内部状态。就像 Rc 的 clone。不过这种感觉也不是解决方法。 我再问问其他看看 ######unsafe也试过了,在unsafe里不能把获得的μt T作为参数调用其它安全函数
kun坤 2020-06-06 14:56:09 0 浏览量 回答数 0

回答

没用过,不过看了下它其实就是这个项目的延伸http://teethgrinder.co.uk/open-flash-chart-2/ 只要数据库取出来的数据组织成他指定的JSON格式就可以: http://teethgrinder.co.uk/open-flash-chart-2/tutorial-6.php 看例子:http://ofcgwt.googlecode.com/svn/demo/Demo.html 看了下他也只是封装了下,你看下 http://ofcgwt.googlecode.com/svn/trunk/src/com/rednels/ofcgwt/client/ChartWidget.java 这个文件,里面主要是几个函数 private native void loadJSON(String id, String json) /* Copyright (C) 2009 Grant Slender This file is part of OFCGWT. http://code.google.com/p/ofcgwt/ OFCGWT is free software: you can redistribute it and/or modify it under the terms of the Lesser GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. OFCGWT is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. See <http://www.gnu.org/licenses/lgpl-3.0.txt>. */ package com.rednels.ofcgwt.client; import java.util.Date; import java.util.List; import com.google.gwt.core.client.GWT; import com.google.gwt.user.client.DOM; import com.google.gwt.user.client.Element; import com.google.gwt.user.client.ui.Widget; import com.rednels.ofcgwt.client.event.ChartClickEvent; import com.rednels.ofcgwt.client.event.ChartClickHandler; import com.rednels.ofcgwt.client.event.DataValueEvents; import com.rednels.ofcgwt.client.event.KeyClickHandler; import com.rednels.ofcgwt.client.model.ChartData; /** * A gwt chart widget based on Open Flash Chart.</br></br> * * Create the ChartWidget and add anywhere a GWT widget can be used. Use the * model {@link ChartData} to build a chart and then pass to * {@link ChartWidget#setChartData(ChartData)} and it will generate and set the * correct JSON data. * <p/> * You can also set JSON via the {@link #setJsonData(String)} method. * */ public class ChartWidget extends Widget { public static final String MIN_PLAYER_VERSION = "9.0.0"; public static final String ALTERNATE_SWF_SRC = "expressInstall.swf"; private static final CacheFixImpl cacheFixImpl = GWT.create(CacheFixImpl.class); private static int count = 0; private boolean isSWFInjected = false; private boolean cacheFixEnabled = false; private boolean hasFlashPlayer = false; private String swfId; private String swfDivId; private String jsonData = ChartFactory.BLANK_CHART_JSON_DATA; private String width = "100%"; private String height = "100%"; private String innerDivTextForFlashPlayerNotFound = "FlashPlayer ${flashPlayer.version} is required."; private String flashurl = "ofcgwt/open-flash-chart.swf"; private String urlPrefix = GWT.getModuleBaseURL(); private ChartData chartData; private Element chartElement; /** * Creates a new ChartWidget. * */ public ChartWidget() { swfId = "swfID_" + count; swfDivId = "swfDivID_" + count; ++count; chartElement = DOM.createElement("div"); DOM.setElementProperty(chartElement, "id", swfDivId); setElement(chartElement); setSize(width, height); hasFlashPlayer = hasFlashPlayerVersion(MIN_PLAYER_VERSION); cacheFixEnabled = cacheFixImpl.isCacheFixNeeded(); } /** * Gets the current OFC flash URL. Defaults to just "open-flash-chart.swf" * * @return the flashurl */ public String getFlashUrl() { return flashurl; } /** * Gets the objects height. * * @return height */ public String getHeight() { return height; } /** * Gets the InnerDiv Text for when flash player is not found or can't be * injected. * * @return string */ public String getInnerDivTextForFlashPlayerNotFound() { return innerDivTextForFlashPlayerNotFound; } /** * Gets the current JSON data for this chart. * * @return a JSON string */ public String getJsonData() { return jsonData; } /** * @return the swfId */ public String getSwfId() { return swfId; } /** * @return the urlPrefix */ public String getUrlPrefix() { return urlPrefix; } /** * Gets the objects width. * * @return width */ public String getWidth() { return width; } /** * Is the CacheFix Enabled? * * @return true if cache fix is enabled, false if not */ public boolean isCacheFixEnabled() { return cacheFixEnabled; } /** * Obtains raw image data of this chart. Call returns null if the flash * chart is not loaded. * * @return String chart image data */ public String getImageData() { if (hasFlashPlayer && isSWFInjected) { return getImageData(getSwfId()); } return null; } /** * Enables an fix/workaround that stops caching of the swf which on IE may * solve some bugs. The workaround adds a unique parameter url to each SWF * making each chart widget non-cachable. On IE this feature is enabled by * default, other agents it is disabled. </br></br>Enable this if you find * problems in with multiple charts. * * @param enable * - true to enable, false to disable */ public void setCacheFixEnabled(boolean enable) { this.cacheFixEnabled = enable; } /** * Sets this charts ChartData and processes it for handlers/events * * @param cd * the ChartData model */ public void setChartData(ChartData cd) { this.chartData = cd; for (com.rednels.ofcgwt.client.model.elements.Element e : chartData.getElements()) { // add chart click events... for (ChartClickHandler cch : e.getChartClickHandlers()) { String onclick = "ofc_onclick('" + getSwfId() + "','" + cch.hashCode() + "')"; e.setOnClick(onclick); } // add key click events... for (KeyClickHandler kch : e.getKeyClickHandlers()) { String onclick = "ofc_onclick('" + getSwfId() + "','" + kch.hashCode() + "')"; e.setKeyOnClick(onclick); } for (Object o : e.getValues()) { if (o instanceof DataValueEvents) { // add data value click events... DataValueEvents dve = (DataValueEvents) o; for (ChartClickHandler ch : dve.getHandlers()) { String onclick = "ofc_onclick('" + getSwfId() + "','" + ch.hashCode() + "')"; dve.setOnClick(onclick); } } } } setJsonData(chartData.buildJSON().toString()); } /** * Sets the OFC flash URL. ie "\path\open-flash-chart.swf" * * @param url * string */ public void setFlashUrl(String url) { this.flashurl = url; } public void setHeight(String height) { height = height.trim().toLowerCase(); super.setHeight(height); // Width validation this.height = height; if (getHeight().equals(height)) { if (isSWFInjected) { Element elem = DOM.getFirstChild(getElement()); DOM.setElementAttribute(elem, "height", height); } } } /** * Sets the InnerDiv Text for when flash player is not found or can't be * injected. <br> * Defaults to "FlashPlayer ${flashPlayer.version} is required." * * @param divtext * a string */ public void setInnerDivTextForFlashPlayerNotFound(String divtext) { this.innerDivTextForFlashPlayerNotFound = divtext; } /** * Sets the JSON data for this chart & updates the chart if ready. Does * nothing if the required flash player is not loaded. * * @param json * a JSON string */ public void setJsonData(String json) { // System.out.println(json); this.jsonData = json; if (hasFlashPlayer && isSWFInjected) { loadJSON(swfId, jsonData); } } /** * Sets the url prefix of the OFC flash swf file. Defaults to the value of * GWT.getModuleBaseURL() * * @param urlPrefix * a URL string */ public void setUrlPrefix(String urlPrefix) { this.urlPrefix = urlPrefix; } public void setWidth(String width) { width = width.trim().toLowerCase(); super.setWidth(width); // Width validation this.width = width; if (getWidth().equals(width)) { if (isSWFInjected) { Element elem = DOM.getFirstChild(getElement()); DOM.setElementAttribute(elem, "width", width); } } } protected void doOnChartClick(String evt) { for (com.rednels.ofcgwt.client.model.elements.Element e : chartData.getElements()) { for (Object o : e.getValues()) { if (o instanceof DataValueEvents) { DataValueEvents ee = (DataValueEvents) o; for (ChartClickHandler ch : ee.getHandlers()) { if (evt.equals("" + ch.hashCode())) { ch.onClick(new ChartClickEvent()); } } } } } } protected List<ChartClickHandler> getHandlers() { return null; } protected void onAttach() { chartElement.setInnerHTML("<div id=\"embed_" + swfId + "\">" + emptyInnerDiv() + "</div>"); ChartFactory.get().register(this); if (!isSWFInjected) { injectSWF(getInternalSWFURL(isCacheFixEnabled(), urlPrefix + flashurl, swfId), swfId, getWidth(), getHeight(), MIN_PLAYER_VERSION, ALTERNATE_SWF_SRC); isSWFInjected = true; } super.onAttach(); } protected void onDetach() { ChartFactory.get().unregister(this); chartElement.removeChild(chartElement.getChildNodes().getItem(0)); isSWFInjected = false; super.onDetach(); } private String emptyInnerDiv() { return getInnerDivTextForFlashPlayerNotFound().replaceAll("\\$\\{flashPlayer.version\\}", MIN_PLAYER_VERSION); } /** * Used internally to returns the correct open flash chart swf url * * @return the swf url string */ private String getInternalSWFURL(boolean iefix, String flashurl, String id) { if (!iefix) return flashurl; return flashurl + ("?id=" + id + (new Date().getTime())); } private native boolean hasFlashPlayerVersion(String v) /*-{ return $wnd.swfobject.hasFlashPlayerVersion(v); }-*/; private native void injectSWF(String swf, String id, String w, String h, String ver, String alt) /*-{ var flashvars = {id: id,allowResize: true}; var params = {scale: 'noscale', allowscriptaccess:'always',wmode: 'transparent'}; var attributes = { data: swf, width: w, height: h, id: id, name: id }; $wnd.swfobject.embedSWF(swf, "embed_"+id, w, h, ver, alt, flashvars, params, attributes); }-*/; private native void loadJSON(String id, String json) /*-{ var swf = $doc.getElementById(id); if ('load' in swf) swf.load(json); }-*/; private native String getImageData(String id) /*-{ var swf = $doc.getElementById(id); var data = null; if ('get_img_binary' in swf) data = swf.get_img_binary(); return data; }-*/; }
kun坤 2020-06-06 16:25:19 0 浏览量 回答数 0

万券齐发助力企业上云,爆款产品低至2.2折起!

限量神券最高减1000,抢完即止!云服务器ECS新用户首购低至0.95折!

回答

2005 年 2 月,AJAX 这个词第一次正式提出,它是 Asynchronous JavaScript and XML 的缩写,指的是通过 JavaScript 的 异步通信,从服务器获取 XML 文档从中提取数据,再更新当前网页的对应部分,而不用刷新整个网页。 具体来说,AJAX 包括以下几个步骤。 1.创建 XMLHttpRequest 对象,也就是创建一个异步调用对象 2.创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL 及验证信息 3.设置响应 HTTP 请求状态变化的函数 4.发送 HTTP 请求 5.获取异步调用返回的数据 6.使用 JavaScript 和 DOM 实现局部刷新 const SERVER_URL = "/server"; let xhr = new XMLHttpRequest(); // 创建 Http 请求 xhr.open("GET", SERVER_URL, true); // 设置状态监听函数 xhr.onreadystatechange = function() { if (this.readyState !== 4) return; // 当请求成功时 if (this.status === 200) { handle(this.response); } else { console.error(this.statusText); } }; // 设置请求失败时的监听函数 xhr.onerror = function() { console.error(this.statusText); }; // 设置请求头信息 xhr.responseType = "json"; xhr.setRequestHeader("Accept", "application/json"); // 发送 Http 请求 xhr.send(null); // promise 封装实现: function getJSON(url) { // 创建一个 promise 对象 let promise = new Promise(function(resolve, reject) { let xhr = new XMLHttpRequest(); // 新建一个 http 请求 xhr.open("GET", url, true); // 设置状态的监听函数 xhr.onreadystatechange = function() { if (this.readyState !== 4) return; // 当请求成功或失败时,改变 promise 的状态 if (this.status === 200) { resolve(this.response); } else { reject(new Error(this.statusText)); } }; // 设置错误监听函数 xhr.onerror = function() { reject(new Error(this.statusText)); }; // 设置响应的数据类型 xhr.responseType = "json"; // 设置请求头信息 xhr.setRequestHeader("Accept", "application/json"); // 发送 http 请求 xhr.send(null); }); return promise; }
剑曼红尘 2020-04-03 15:32:59 0 浏览量 回答数 0

问题

在 berserkJS 中无缝使用 Wind.js:报错

在 berserkJS 中无缝使用 Wind.js 收拢异步执行流程 一、Wind.js 是怎么实现的异步流程控制。 二、$await 为什么是个函数而不是作为一个简单的语法标记存在? 三、为什么要用 eval 并且还没有封装它? 四、为什...
kun坤 2020-06-07 14:00:40 0 浏览量 回答数 1

问题

Vue面试题汇总【精品问答】

是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,方便与第三方库或既有项目整合。 从0到1自己构架一个vue项目...
问问小秘 2020-05-25 18:02:28 20475 浏览量 回答数 4

问题

【javascript学习全家桶】934道javascript热门问题,阿里百位技术专家答疑解惑

阿里极客公益活动:或许你挑灯夜战只为一道难题或许你百思不解只求一个答案或许你绞尽脑汁只因一种未知那么他们来了,阿里系技术专家来云栖问答为你解答技术难题了他们用户自己手中的技术来帮助用户成长本次活动特邀百位阿里技术专家对javascript常...
管理贝贝 2019-12-01 20:07:22 6202 浏览量 回答数 1

云产品推荐

上海奇点人才服务相关的云产品 小程序定制 上海微企信息技术相关的云产品 国内短信套餐包 ECS云服务器安全配置相关的云产品 开发者问答 阿里云建站 自然场景识别相关的云产品 万网 小程序开发制作 视频内容分析 视频集锦 代理记账服务